2015-08-31 60 views
0

我在我的网站上有一个使用Bootstrap 3的表单。它在IE,Chrome和Safari中工作得很好,但由于某些原因,表单末尾的下拉选项元素在Firefox中不起作用。我尝试过不同的操作系统。选定的选项不会“停留”在下拉字段中。任何人都可以给我一个线索吗?为什么此选择表单在Firefox中不起作用?

<!--------The signup form-------> 
       <form name="signupform" id="signupform" onsubmit="return false;" class="form-signin"> 
<div class="form"> 
        <div class="form-group"> 

        <input id="username" type="text" class="form-control" onblur="checkusername()" 
        onkeyup="restrict('username')" maxlength="16" placeholder="Username"> 
        <br> 
        <span id="unamestatus"></span> 
<br> 
        <input id="email" type="text" class="form-control" placeholder="Email" onfocus="emptyElement('status')" 
        onkeyup="restrict('email')" maxlength="88"> 
        <br> 
        <input id="pass1" type="password" class="form-control" placeholder="Create Password" onfocus="emptyElement('status')" 
        maxlength="100"> 
        <br> 
        <input id="pass2" type="password" class="form-control" placeholder="Retype Password" onfocus="emptyElement('status')" 
        maxlength="100"> 

        <br> 
<a href="#" data-toggle="tooltip" data-placement="bottom" title="Choose the type of account you want"> 
        <select id="accounttype" class="form-control" onfocus="emptyElement('status')"></a> 
         <option value="" disabled selected> 
         Choose Account Type 
         </option> 
<option value="b"> 
         I am an artist 
         </option> 
         <option value="a"> 
         I am looking for artists 
         </option> 
       </select> 

</br> 

        <br> 
        <button id="signupbtn" onclick="signup()" class="btn btn-success pull-right"> 
        Create Account 
        </button> 
        <br> 
        <span id="status" style="color: white"></span> 
       </form> 
       <!--------End of form-------> 
+0

你有没有注意到你没有关闭'div's?另外,请注意代码缩进。 – Roope

+0

我已经关闭了div的。我只是忘记包含该代码。谢谢你的提示。 – JulianJ

回答

1

您嵌套在锚(a)内的select元件,其是无效的标记的开口部。

您还有两个失踪的关闭div标签在form结束之前。

此外,disabled不是option标记的有效属性。

正确格式化您的代码更易于这些错误找

<form name="signupform" id="signupform" onsubmit="return false;" class="form-signin"> 
    <div class="form"> 
     <div class="form-group"> 

      <input id="username" type="text" class="form-control" onblur="checkusername()" 
        onkeyup="restrict('username')" maxlength="16" placeholder="Username"> 
      <br> 
      <span id="unamestatus"></span> 
      <br> 
      <input id="email" type="text" class="form-control" placeholder="Email" onfocus="emptyElement('status')" 
        onkeyup="restrict('email')" maxlength="88"> 
      <br> 
      <input id="pass1" type="password" class="form-control" placeholder="Create Password" onfocus="emptyElement('status')" 
        maxlength="100"> 
      <br> 
      <input id="pass2" type="password" class="form-control" placeholder="Retype Password" onfocus="emptyElement('status')" 
        maxlength="100"> 

      <br> 
      <a href="#" data-toggle="tooltip" data-placement="bottom" title="Choose the type of account you want"> 
       <select id="accounttype" class="form-control" onfocus="emptyElement('status')"> 
      </a> <!-- ^^ select element inside anchor ^^ --> 
      <option value="" disabled selected> <!-- <-- disabled should be on select element, not option --> 
       Choose Account Type 
      </option> 
      <option value="b"> 
       I am an artist 
      </option> 
      <option value="a"> 
       I am looking for artists 
      </option> 
      </select> 

      </br> 

      <br> 
      <button id="signupbtn" onclick="signup()" class="btn btn-success pull-right"> 
       Create Account 
      </button> 
      <br> 
      <span id="status" style="color: white"></span> 
     </div> 
    </div> 
</form> 
+0

非常感谢。我已经按照你的意见,现在它在Firefox中工作。谢谢。 – JulianJ

1

林不确定什么<a>是,但它的具体问题的原因,改变下面将使其工作

<a href="#" data-toggle="tooltip" data-placement="bottom" title="Choose the type of account you want"></a> 
     <select id="accounttype" class="form-control" onfocus="emptyElement('status')"> 
      <option value="" disabled selected> 
       Choose Account Type 
      </option> 
      <option value="b"> 
       I am an artist 
      </option> 
      <option value="a"> 
       I am looking for artists 
      </option> 
     </select> 
相关问题