javascript - 为什么这个选择表单在 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

您打开了嵌套在 anchor (a) 内的 select 元素，该 anchor 是无效标记。

在 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>