為什么此選擇表單在Firefox中不起作用？

Question

我的網站上有一個使用Bootstrap 3的表單。它在IE，Chrome和Safari中都可以正常工作，但是由於某種原因，表單末尾的下拉選項元素在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------->

Answer 1

您打開嵌套在錨點（ a ）內的select元素，該標記無效。

在form結尾之前，您還會缺少兩個關閉的div標簽。

另外， 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>

Answer 2

我不確定<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>