ป้อนฟอร์มอัตโนมัติของ Google Chrome และพื้นหลังสีเหลือง

245

ฉันมีปัญหาในการออกแบบกับ Google Chrome และฟังก์ชั่นป้อนอัตโนมัติในรูปแบบ หาก Chrome จดจำการเข้าสู่ระบบ / รหัสผ่านบางส่วนมันจะเปลี่ยนสีพื้นหลังเป็นสีเหลือง

นี่คือภาพหน้าจอบางส่วน:

ข้อความแสดงแทน ข้อความแสดงแทน

วิธีลบพื้นหลังนั้นหรือเพียงแค่ปิดใช้งานการป้อนอัตโนมัตินี้

html  css  forms  google-chrome  autofill 
— HSZ
แหล่งที่มา
4
ฉันต้องการดูว่ามีคำตอบนี้หรือไม่
— Kyle
12
สำหรับการจัดแต่งทรงผมสีนี้สามารถจริงจังกับองค์ประกอบการออกแบบเช่นการสรุปในแท็กอินพุตใน Chrome เช่นกันฉันต้องการเปลี่ยนสีมากกว่าที่จะปิด
— Kyle
3
Google ดูเหมือนจะรับทราบปัญหานี้ในระดับหนึ่ง ดูcode.google.com/p/chromium/issues/detail?id=46543
— MitMaro
1
หากต้องการปิดใช้งานการเติมข้อความอัตโนมัติคุณสามารถเพิ่มการเติมข้อความอัตโนมัติ = "ปิด"ให้กับองค์ประกอบการป้อนข้อมูลของคุณเช่น <input type = "text" id = "input" autocomplete = "ปิด">
— joe_young
1
เป็นเพียงข้อมูลเพิ่มเติม: ฉันถูกมันกัดเมื่อฉันมีฟิลด์รหัสผ่าน ฉันได้รับการเน้นของฉันโดยอัตโนมัติ (สีเหลือง) และเต็มไปด้วยค่าแปลก และฉันพบวิธีแก้ปัญหาที่นี่: zigpress.com/2014/11/22/stop-chrome-messing-forms ... การแก้ปัญหาอยู่ในส่วนที่ระบุว่า "ปิดใช้งาน Google Chrome ป้อนอัตโนมัติ" ... เพิ่มเขตข้อมูลที่ซ่อนอยู่
— Cokorda Raka

คำตอบ:

282

เปลี่ยน "สีขาว" เป็นสีใดก็ได้ที่คุณต้องการ

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
}
— Fareed Alnamrouti
แหล่งที่มา
4
ความคิดที่ดี. ฉันจะติดกับ 50 หรือ 100 เมื่อใดก็ตามที่เพียงพอ (กล่องใส่ขนาดปกติ) เพื่อหลีกเลี่ยงความนิยมที่อาจเกิดขึ้นกับอุปกรณ์ที่อ่อนแอกว่า (และความจำเป็นในการ px หลังจาก 0 ไม่ได้)
— แฟรงก์ Nocke
4
รักแฮ็คนี้! คิดมาก ... ทุกคนลบการป้อนอัตโนมัติ ฉันต้องการทำให้การป้อนอัตโนมัติดำเนินต่อไปเพียงนั่งรถสีเหลืองที่น่าเกลียด
— เทรวิส
1
ไม่ทำงานหากคุณมีภาพพื้นหลังด้านหลังช่องใส่ของคุณเพียงแค่เติมพื้นที่ทั้งหมดด้วยสีขาว ฉันลองวิธีแก้ปัญหาทั้งหมดในหน้านี้รวมถึง jquery based และพวกเขาไม่ได้ผลสำหรับฉันในท้ายที่สุดฉันต้องเพิ่มการเติมข้อความอัตโนมัติ = "ปิด" ลงในช่อง
— Myke Black
19
เพื่อจัดสไตล์การใช้สีข้อความ-webkit-text-fill-color- ดูคำถามนี้
— Erwin Wessels
2
มีข้อผิดพลาดฉันไม่ได้เปลี่ยนไวยากรณ์ แต่ตอนนี้ใช้ได้:box-shadow: inset 0 0 0 1000px white !important;
— Muhammad Umer
49

หากคุณต้องการฟิลด์อินพุตแบบโปร่งใสคุณสามารถใช้การเปลี่ยนแปลงและการหน่วงเวลาการเปลี่ยนแปลง 

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-transition-delay: 9999s;
    -webkit-transition: color 9999s ease-out, background-color 9999s ease-out;
}
— Gísli Freyr Svavarsson
แหล่งที่มา
ทางออกที่ดีที่สุดสำหรับฉันเป็นค่าสี RGBA -webkit-box-shadowไม่ได้ทำงานใน ลดความจำเป็นที่จะต้องให้ค่าสีสำหรับการประกาศนี้: ค่าเริ่มต้นจะยังคงมีผลอยู่
— Sébastien
ที่ดียิ่งขึ้นคือการใช้ความล่าช้าในการเปลี่ยนแทนระยะเวลาของมันเพื่อไม่ให้มีการผสมสีเลย
— antoine129
ดี แต่ด้วยเหตุผลบางอย่างฉันต้องย้ายกฎนี้ในตอนท้ายของไฟล์มิฉะนั้นก็ใช้งานไม่ได้
— Igor Mizak
นั่นคือสิ่งที่ฉันมองหา! ขอบคุณ!
— Akhmedzianov Danilian
43

ทางออกที่นี่ :

if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0) {
    $(window).load(function(){
        $('input:-webkit-autofill').each(function(){
            var text = $(this).val();
            var name = $(this).attr('name');
            $(this).after(this.outerHTML).remove();
            $('input[name=' + name + ']').val(text);
        });
    });
}
— Alessandro Benedetti
แหล่งที่มา
สิ่งนี้ใช้ได้ในขณะที่คำตอบยอดนิยมไม่ได้ อย่างไรก็ตามฉันคิดว่าฉันจะไม่พยายามเปลี่ยนพฤติกรรมตั้งแต่ a) นี่คือจาวาสคริปต์ดังนั้นจึงมีวินาทีอยู่ระหว่างการทำงานและจะไม่ (จนกว่าจะโหลด js) และ b) มันอาจสร้างความสับสนให้กับผู้ใช้งานโครเมี่ยมที่คุ้นเคยกับพฤติกรรมเริ่มต้น
— TK123
3
โครเมี่ยมของฉันเพิ่งใช้สีเหลืองกับอินพุตใหม่ :(
— ดัสตินซิลค์
โปรดอย่า สิ่งนี้จะไม่ทำงานกับเฟรมเวิร์ก JS ใด ๆ สำหรับเว็บไซต์แบบคงที่เท่านั้น
— Akhmedzianov Danilian
26

ใน Firefox คุณสามารถปิดใช้งานการเติมข้อความอัตโนมัติทั้งหมดในแบบฟอร์มโดยใช้แอตทริบิวต์ autocomplete = "off / on" การเติมข้อความอัตโนมัติแต่ละรายการในทำนองเดียวกันสามารถตั้งค่าได้โดยใช้แอตทริบิวต์เดียวกัน

<form autocomplete="off" method=".." action="..">  
<input type="text" name="textboxname" autocomplete="off">

คุณสามารถทดสอบสิ่งนี้ได้ใน Chrome ตามที่ควรจะเป็น

— Kinlan
แหล่งที่มา
7
autocomplete="off"ทุกวันนี้ไม่สามารถเข้าถึงการกลึงได้
— João
4
น่าเสียดายที่โซลูชันนี้ใช้งานไม่ได้กับ Chrome อีกต่อไป
— henrywright
1
สิ่งนี้มีความน่าเชื่อถือสูงเนื่องจากคุณไม่ได้แก้ปัญหาจริงที่นี่ แต่คุณกำลังสร้างใหม่โดยทำลายผู้ใช้เนื่องจากพวกเขาต้องพิมพ์รายละเอียดการเข้าสู่ระบบ (สันนิษฐาน) ด้วยตนเอง (ถ้าพวกเขาจำสิ่งที่พวกเขาเป็น)
— xorinzor
25

หากคุณต้องการเก็บการป้อนอัตโนมัติเช่นเดียวกับข้อมูลใด ๆ ตัวจัดการที่แนบมาและฟังก์ชันการทำงานที่แนบมากับองค์ประกอบการป้อนข้อมูลของคุณลองสคริปต์นี้:

if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0)
{
    var _interval = window.setInterval(function ()
    {
        var autofills = $('input:-webkit-autofill');
        if (autofills.length > 0)
        {
            window.clearInterval(_interval); // stop polling
            autofills.each(function()
            {
                var clone = $(this).clone(true, true);
                $(this).after(clone).remove();
            });
        }
    }, 20);
}

มันสำรวจความคิดเห็นจนกว่าจะพบองค์ประกอบการป้อนอัตโนมัติใด ๆ โคลนพวกเขารวมถึงข้อมูลและเหตุการณ์จากนั้นแทรกพวกเขาลงใน DOM ในตำแหน่งเดียวกันและลบต้นฉบับ มันหยุดการสำรวจเมื่อพบว่ามีการโคลนเพราะบางครั้งการป้อนอัตโนมัติใช้เวลาหนึ่งวินาทีหลังจากโหลดหน้าเว็บ นี่คือการเปลี่ยนแปลงของตัวอย่างโค้ดก่อนหน้านี้ แต่มีประสิทธิภาพมากขึ้นและช่วยให้สามารถใช้งานได้เหมือนเดิมมากที่สุด

(ยืนยันว่าทำงานใน Chrome, Firefox และ IE 8)

— เจสัน
แหล่งที่มา
6
นี่เป็นทางออกเดียวที่ฉันพบว่าทำงานได้โดยไม่ต้องปิดใช้งานการเติมข้อความอัตโนมัติ
— Xeroxoid
อาจไม่จำเป็นต้องตั้งค่าช่วงเวลาเนื่องจากการป้อนอัตโนมัติของ Chrome บน window.load
— Timo Huovinen
2
ทำงานได้โดยไม่ต้องลบอัตโนมัติสมบูรณ์ทางออกที่ดีกว่ารุ่นที่มีคะแนนโหวตนับล้าน
— พันธมิตร
วิธีแก้ปัญหาอื่นไม่ได้ผลสำหรับฉันแม้แต่ผู้ที่ได้รับความนิยมมากที่สุด แต่ผู้นี้ก็ทำได้ ปัญหาซึ่งตรงข้ามกับที่ @Timo กล่าวไว้ข้างต้นคือ Chrome ไม่ได้ป้อนข้อมูลอัตโนมัติที่ window.load แม้ว่าสิ่งนี้จะทำงานได้ แต่ปัญหาอย่างหนึ่งของมันคือถ้าไม่มีองค์ประกอบ -webkit-autofill วงก็จะทำงานอย่างต่อเนื่อง คุณไม่จำเป็นต้องใช้ช่วงเวลาในการทำงาน เพียงตั้งค่าการหมดเวลาด้วยอาจล่าช้า 50 มิลลิวินาทีและจะทำงานได้ดี
— กาวิน
16

CSS ต่อไปนี้จะลบสีพื้นหลังสีเหลืองและแทนที่ด้วยสีพื้นหลังที่คุณเลือก มันไม่ได้ปิดใช้งานการเติมอัตโนมัติและไม่จำเป็นต้องมี jQuery หรือ Javascript hacks

input:-webkit-autofill {
    -webkit-box-shadow:0 0 0 50px white inset; /* Change the color to your own background color */
    -webkit-text-fill-color: #333;
}
input:-webkit-autofill:focus {
    -webkit-box-shadow: /*your box-shadow*/,0 0 0 50px white inset;
    -webkit-text-fill-color: #333;
}

คัดลอกโซลูชันจาก: แทนที่การกรอกแบบฟอร์มเบราว์เซอร์และการไฮไลต์อินพุตด้วย HTML / CSS

— humbads
แหล่งที่มา
เล่นได้ไม่ดีถ้ามีการใช้เงาหลายอัน
— ขจัดความสามารถของฉันเมื่อ
6

ใช้งานได้สำหรับฉันเท่านั้นที่จำเป็นต้องเปลี่ยน css

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #ffffff inset!important;
}

คุณสามารถใส่สีใด ๆ ในสถานที่ของ#ffffff

— มิลาน
แหล่งที่มา
3

แฮ็คเล็กน้อย แต่ทำงานได้อย่างสมบูรณ์แบบสำหรับฉัน

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset;
}
— maximilianhp
แหล่งที่มา
3

การรวมกันของคำตอบที่ได้ผลสำหรับฉัน 

<style>
    input:-webkit-autofill,
    input:-webkit-autofill:hover,
    input:-webkit-autofill:focus,
    input:-webkit-autofill:active {
        -webkit-box-shadow: 0 0 0px 1000px #373e4a inset !important;
           -webkit-text-fill-color: white !important;
   }
</style>
— เลอรอย
แหล่งที่มา
นี่เป็นเพียงตัวอย่างเดียวที่ใช้ได้กับฉันทั้งข้อความและพื้นหลังใน Chrome เวอร์ชัน 53.0.2785.116 m
— pleshy
2

นี่คือ Jason's รุ่น MooTools แก้ไขใน Safari ด้วย

window.addEvent('domready',function() { 
    $('username').focus();

    if ((navigator.userAgent.toLowerCase().indexOf(\"chrome\") >= 0)||(navigator.userAgent.toLowerCase().indexOf(\"safari\") >= 0))
    {

        var _interval = window.setInterval(function ()
        {
            var autofills = $$('input:-webkit-autofill');
            if (autofills.length > 0)
            {

                window.clearInterval(_interval); // stop polling
                autofills.each(function(el)
                {
                    var clone = el.clone(true,true).inject(el,'after');;
                    el.dispose();
                });
            }
        }, 20);                                               


    }
});
— คนสนิท
แหล่งที่มา
1
อย่าใช้สคริปต์นี้ หากไม่มีองค์ประกอบที่เติมอัตโนมัติลูปจะทำงานอย่างต่อเนื่องที่ 20 มิลลิวินาที ช่วงเวลาไม่จำเป็น ตั้งค่าการหมดเวลาหลังจากหน้าต่างโหลดที่ประมาณ 50 มิลลิวินาทีและนั่นจะมีเวลาอีกมากในการลบการออกแบบ
— กาวิน
2

วิธีนี้ช่วยแก้ไขปัญหาทั้งใน Safari และ Chrome

if(navigator.userAgent.toLowerCase().indexOf("chrome") >= 0 || navigator.userAgent.toLowerCase().indexOf("safari") >= 0){
window.setInterval(function(){
    $('input:-webkit-autofill').each(function(){
        var clone = $(this).clone(true, true);
        $(this).after(clone).remove();
    });
}, 20);
}
— Arjan
แหล่งที่มา
เป็นสิ่งที่ใช้ได้ผลสำหรับฉัน แต่ข้อผิดพลาดยังคงมีและสามารถเห็นได้ไม่มีวันที่จะได้รับการแก้ไข code.google.com/p/chromium/issues/detail?id=46543#c22
— Eduardo M
คุณไม่เคยล้างช่วงเวลาของคุณ นี่คือรหัสเลอะเทอะอย่าใช้มัน
— กาวิน
1
จริงๆแล้วมันใช้งานไม่ได้ ฉันไม่สามารถพิมพ์อะไรก็ได้ในอินพุตเนื่องจากพวกเขาถูกโคลนอย่างต่อเนื่อง เกือบจะถึง ...
— ดัสตินซิลค์
ลองใช้ var id = window.setInterval (ฟังก์ชั่น () {$ ('อินพุต: -webkit-autofill') แต่ละรายการ (ฟังก์ชั่น () {var clone = $ (นี่) .clone (จริงจริง); $ (นี่) .after (clone) .remove ();});}, 20); $ ( 'ป้อนข้อมูล: -webkit-ป้อนอัตโนมัติ'). โฟกัส (ฟังก์ชั่น () {window.clearInterval (ID);});
— Dustin Silk
2

สิ่งนี้ช่วยฉันได้เพียง CSS เวอร์ชันเดียว

input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset; }

ที่สีขาวสามารถสีใด ๆ ที่คุณต้องการ

— Matt Goo
แหล่งที่มา
2

ฉันใช้สิ่งนี้

input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset !important; }
input:focus:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset !important; }
/* You can use color:#color to change the color */
— Bhavesh Gangani
แหล่งที่มา
1

ในแท็กของคุณเพียงแทรกรหัสบรรทัดเล็ก ๆ นี้ 

autocomplete="off"

อย่างไรก็ตามอย่าวางสิ่งนี้ลงในฟิลด์ชื่อผู้ใช้ / อีเมล / idname เพราะหากคุณยังคงต้องการใช้การเติมข้อความอัตโนมัติมันจะปิดการใช้งานสำหรับฟิลด์นี้ แต่ฉันพบวิธีนี้เพียงวางรหัสในแท็กใส่รหัสผ่านของคุณเพราะคุณไม่เคยเติมรหัสผ่านอัตโนมัติอย่างไรก็ตาม การแก้ไขนี้ควรลบความเข้มของสีความสามารถในการเติมข้อความอัตโนมัติในฟิลด์อีเมล / ชื่อผู้ใช้ของคุณและช่วยให้คุณหลีกเลี่ยงการแฮ็กขนาดใหญ่เช่น Jquery หรือจาวาสคริปต์

— Alex Sarnowski
แหล่งที่มา
1

หากคุณต้องการกำจัดมันทั้งหมดฉันได้ปรับโค้ดในคำตอบก่อนหน้านี้เพื่อให้ทำงานได้ในการโฮเวอร์, แอคทีฟและโฟกัส:

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:active, input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px white inset;
}
— อเล็กซ์
แหล่งที่มา
1
เพิ่ม!importantเป็นสิ่งที่จำเป็น แต่ขอบคุณมันช่วยฉันได้มาก
— Polochon
0

นี่คือวิธีการแก้ปัญหา Mootools ที่ทำเช่นเดียวกับของ Alessandro - แทนที่ข้อมูลที่ได้รับผลกระทบแต่ละอันด้วยอันใหม่

if (Browser.chrome) {
    $$('input:-webkit-autofill').each(function(item) {
        var text = item.value;
        var name = item.get('name');
        var newEl = new Element('input');
        newEl.set('name', name);
        newEl.value = text;
        newEl.replaces(item);
    });
}
— และในที่สุดก็
แหล่งที่มา
0

เกี่ยวกับการแก้ปัญหานั้น:

if ($.browser.webkit) {
    $(function() {
        var inputs = $('input:not(.auto-complete-on)');

        inputs.attr('autocomplete', 'off');

        setTimeout(function() {
            inputs.attr('autocomplete', 'on');
        }, 100);
    });
}

มันปิดการเติมข้อมูลอัตโนมัติและเติมอัตโนมัติ (เพื่อให้พื้นหลังสีเหลืองหายไป) รอ 100 มิลลิวินาทีจากนั้นเปลี่ยนการใช้งานเติมเต็มอัตโนมัติกลับมาโดยไม่ต้องป้อนอัตโนมัติ

หากคุณมีอินพุตที่ต้องป้อนข้อมูลอัตโนมัติให้กำหนดauto-complete-onคลาส css

— Cryss
แหล่งที่มา
0

วิธีการแก้ปัญหาไม่ได้ผลสำหรับฉันชื่อผู้ใช้และรหัสผ่านที่ป้อนเข้ามานั้นยังคงมีอยู่และให้พื้นหลังสีเหลือง

ดังนั้นฉันจึงถามตัวเองว่า "Chrome จะกำหนดสิ่งที่ควรป้อนอัตโนมัติในหน้าเว็บที่กำหนดได้อย่างไร"

"มันมองหารหัสอินพุท, ชื่ออินพุทหรือไม่? รหัสแบบฟอร์ม?

จากการทดลองของฉันด้วยชื่อผู้ใช้และอินพุตรหัสผ่านมีเพียงสองวิธีที่ฉันพบว่าจะทำให้ Chrome ไม่สามารถหาฟิลด์ที่ควรป้อนอัตโนมัติได้:

1) ใส่รหัสผ่านหน้าของการป้อนข้อความ 2) ให้ชื่อและรหัสเดียวกันกับพวกเขา ... หรือไม่มีชื่อและรหัส

หลังจากที่โหลดหน้าเว็บด้วย javascript คุณสามารถเปลี่ยนลำดับของอินพุตบนหน้าเว็บหรือตั้งชื่อและ ID ให้กับพวกเขาแบบไดนามิก ...

และ Chrome ไม่ทราบว่ามีอะไรกระทบ ... การเติมข้อความอัตโนมัติยังคงปิดอยู่

แฮ็คบ้าฉันรู้ แต่มันใช้งานได้สำหรับฉัน

Chrome 34.0.1847.116, OSX 10.7.5

— i_a
แหล่งที่มา
0

วิธีเดียวที่เหมาะกับฉันคือ: (จำเป็นต้องใช้ jQuery)

$(document).ready(function(e) {
    if ($.browser.webkit) {
        $('#input_id').val(' ').val('');
    }
});
— user3638028
แหล่งที่มา
0

ฉันแก้ไขปัญหานี้สำหรับฟิลด์รหัสผ่านที่ฉันมีเช่นนี้:

ตั้งค่าประเภทอินพุตเป็นข้อความแทนที่จะเป็นรหัสผ่าน

ลบค่าข้อความอินพุตด้วย jQuery

แปลงประเภทอินพุตเป็นรหัสผ่านด้วย jQuery

<input type="text" class="remove-autofill">

$('.js-remove-autofill').val('');    
$('.js-remove-autofill').attr('type', 'password');
— Ahmad Ajmi
แหล่งที่มา
ไม่ทำงานใน Chrome ทันทีที่ฟิลด์นั้นกลายเป็น type = รหัสผ่าน Chrome จะเติมลงใน
— mowgli
0

การอัพเดตโซลูชัน Arjans เมื่อพยายามที่จะเปลี่ยนค่ามันจะไม่ช่วยให้คุณ มันใช้งานได้ดีสำหรับฉัน เมื่อคุณมุ่งเน้นไปที่การป้อนข้อมูลจากนั้นจะเป็นสีเหลือง มันใกล้พอ

$(document).ready(function (){
    if(navigator.userAgent.toLowerCase().indexOf("chrome") >= 0 || navigator.userAgent.toLowerCase().indexOf("safari") >= 0){
        var id = window.setInterval(function(){
            $('input:-webkit-autofill').each(function(){
                var clone = $(this).clone(true, true);
                $(this).after(clone).remove();
            });
        }, 20);

        $('input:-webkit-autofill').focus(function(){window.clearInterval(id);});
    }
});

$('input:-webkit-autofill').focus(function(){window.clearInterval(id);});
— ไหมดัสติน
แหล่งที่มา
0

คำตอบnamrouti ค่าโดยสารถูกต้อง แต่พื้นหลังยังคงได้รับสีเหลืองเมื่อป้อนข้อมูลที่ถูกเลือก การเพิ่ม!importantแก้ไขปัญหา หากคุณต้องการtextareaและยังselectมีพฤติกรรมเดียวกันเพียงแค่เพิ่มtextarea:-webkit-autofill, select:-webkit-autofill

อินพุตเท่านั้น

input:-webkit-autofill {
    background-color: rgb(250, 255, 189) !important;
}

อินพุต, เลือก, textarea

input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    background-color: rgb(250, 255, 189) !important;
}
— เมอร์ลิน
แหล่งที่มา
0

การเพิ่มautocomplete="off"จะไม่ตัด

type="search"เปลี่ยนประเภทการป้อนข้อมูลแอตทริบิวต์
Google ไม่ใช้การป้อนอัตโนมัติกับอินพุตด้วยการค้นหาประเภทหนึ่ง

หวังว่านี่จะช่วยคุณประหยัดเวลา

— Matas Vaitkevicius
แหล่งที่มา
0

หากคุณต้องการหลีกเลี่ยงการสั่นไหวสีเหลืองจนกว่า css ของคุณจะถูกนำไปใช้ตบการเปลี่ยนแปลงในเด็กเลวที่เป็นเช่นนั้น: 

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    transition: background-color 10s ease-in-out 0s;
}
— เซบาสเตียน
แหล่งที่มา
-1

ทางออกสุดท้าย:

$(document).ready(function(){
    var contadorInterval = 0;
    if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0)
    {
        var _interval = window.setInterval(function ()
        {
            var autofills = $('input:-webkit-autofill');
            if (autofills.length > 0)
            {
                window.clearInterval(_interval); // stop polling
                autofills.each(function()
                {
                    var clone = $(this).clone(true, true);
                    $(this).after(clone).remove();
                    setTimeout(function(){
//                        $("#User").val('');
                        $("#Password").val('');
                    },10);
                });
            }
            contadorInterval++;
            if(contadorInterval > 50) window.clearInterval(_interval); // stop polling
        }, 20);
    }else{
        setTimeout(function(){
//            $("#User").val('');
            $("#Password").val('');
        },100);
    }
});
— Charly Novoa
แหล่งที่มา
-2 
<input type="text" name="foo" autocomplete="off" />

คำถามที่คล้ายกัน: ลิงก์

— Aditya P Bhatt
แหล่งที่มา
chrome ละเว้นการเติมข้อความอัตโนมัติ = "ปิด"
— Sven van den Boogaart
ปิดการใช้งานการเติมข้อความอัตโนมัติใน Google Chrome: <a href=" browsers.about.com/od/googlechrome/ss/... >
— Aditya P Bhatt
-5

เพิ่งพบว่าตัวเองมีคำถามเดียวกัน สิ่งนี้ใช้ได้กับฉัน:

form :focus {
  outline: none;
}
3
เค้าร่างบนกล่องเมื่อคุณคลิกไม่ใช่สีพื้นหลังของอินพุตที่ป้อนอัตโนมัติ
— Claire
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.