对文本框（在Chrome中）进行自动填充会导致预填充，而不会推送输入

我有一个非常奇怪的问题，导致访问者遇到很多问题。对文本框（在Chrome中）进行自动填充会导致预填充，而不会推送输入

在普通文本框中，Chrome（以及其他浏览器）建议预填字符串。当您将它们悬停并移开鼠标时，它们不会被选中并写入文本框中。

但是，在我的设置中，我有一个奇怪的情况。当我悬停我的选项，然后移动鼠标时，它会选择框中的一个项目。这会导致很多“请输入电子邮件”消息，而用户在其屏幕上看到一封电子邮件。在这个视频

见问题： https://www.youtube.com/watch?v=Vh2nb0_IR3Q

我给这家特定电子邮件标记：

<input type="text" name="Email" placeholder="E-mail" id="newUserEmail" class="email_input newinputtxt">

有没有人有一个提示？因为我真的失去了......

编辑：

完全ASP.NET MVC标记：

<asp:Content ID="Content1" ContentPlaceHolderID="plhMain" runat="server"> 
    <h2>Indtast e-mail adresse</h2> 
    <div class="checkout__section checkout__section--login checkout_auth"> 
      <div class="single_login"> 
       <div id="newUserBox"> 
        <div id="provideUserEmailBox"> 
         <div class="email_auth"> 
          <div> 
           <input type="text" name="Email" placeholder="E-mail" id="newUserEmail" class="email_input newinputtxt" /> 
          </div> 
          <span class="red auth-error-text" style="display: none;" id="invalidEmailText">Der skal indtastes en gyldig e-mail</span> 
           <ul class="red_checkmarks" style="margin-top: 5px;"> 
            <li>Vi bruger e-mail adressen til at sende en bekræftelse pa din ordre</li> 
            <li>Hvis du vil, kan du logge ind eller oprette en konto på næste side.</li> 
           </ul> 
         </div> 
        </div> 

        <div id="createNewUserBtnBox"> 
         <input id="newUserBtn" type="button" class="button button--primary" value="Fortsæt" /> 
         <span class="red auth-error-text" id="createNewUserErrorText"></span> 
        </div> 
       </div> 
      </div> 
      <div id="socialLoginList"> 
       <button class="pfacebook" type="button" name="provider" value="facebook" title="Log ind med din Facebook konto"> 
        Facebook 
       </button> 
       <button class="pgoogle" type="button" name="provider" value="google" title="Log ind med din Google konto"> 
        Google 
       </button> 
      </div> 
    </div> 
    <script type="text/javascript"> 
     $(function() { 
      $("#newUserEmail").keypress(function (event) { 
       if (event.keyCode == 13) { 
        event.preventDefault(); 
        $("#newUserBtn").click(); 
       } 
      }); 

      var auth = CheckoutAuthorizationFlow({ LoginUserBox: "#loginWithUserBox", NewUserBox: "#newUserBox" }); 
      auth.Init(); 

      var facebookLogin = function() { 

       var loginUrl = '/login?returnurl=' + encodeURIComponent(document.location.href) + '&r=' + (new Date().toUTCString()) + '&provider=facebook'; 

       //alert('facebook login'); 

       document.location.href = loginUrl; 
       return; 
      }; 

      var googleLogin = function() { 

       var loginUrl = '/login?returnurl=' + encodeURIComponent(document.location.href) + '&r=' + (new Date().toUTCString()) + '&provider=google'; 

       document.location.href = loginUrl; 
       return; 
      }; 
      $(".pfacebook").click(facebookLogin); 
      $(".pgoogle").click(googleLogin); 

     }); 
    </script> 
</asp:Content>

来源

2014-09-22 Lars Holdgaard

你已经标记了css，但是没有类定义？此外，这是否只发生在铬的这个错误？ – 2014-09-22 16:29:59

@MrCoder我为CSS添加标签的理由是因为我可能怀疑CSS有这个原因，但这可能是一个非常愚蠢的想法。我没有使用其他浏览器，所以我没有能够强制其他浏览器上的电子邮件建议 - 仍然尝试使用数据库的 – 2014-09-22 16:31:43

？ – jan199674 2014-09-22 16:39:56

所以我的室友，谁一直有点与WordPress几年回来，刚刚来到我的电脑，并说：

“把它包裹在表单标签！”

所以我告诉他这是一个可怕的想法，他说“试试看”。

我做到了。

它他妈的工作。

So tl; dr - >将它包裹在表单标签中，它可以工作...我会哭的。

来源

2014-09-22 17:14:27

对文本框（在Chrome中）进行自动填充会导致预填充，而不会推送输入

回答

相关问题