html输入类型在chrome中无法正确显示

时间:2018-06-24 16:01:54

标签: html google-chrome radio-button

这是我使用过的代码,但是我认为代码没有什么问题,因为它在Safari中效果很好,但在Chrome中却没有。The left hand is Chrome and the other is Safari. As you can see, the radio, submit, reset type somehow disappeared in Chrome.

Check out this image通常,应该有多个可以选择打开或关闭的复选框。但是在我的浏览器中,它不起作用。

 <form method="GET">
         <input type="radio" name="gender" value="male">Male <br>
         <input type="radio" name="gender" value="female">Female <br>
         <input type="radio" name="gender" value="other">Other <br>
         Pets <br>
         <input type="checkbox" name="dog" value=""> Dogs<br>
         <input type="checkbox" name="cat" value=""> Cats<br>
         Cars <br>
         <select class="" name="cars">
           <option value="volvo" name="volvo">Volvo</option>
           <option value="Audi" name="audi">Audi</option>
         </select><br>
         <input type="submit" name="" value="Register">
         <input type="reset" name="" value="Reset">
    </form>

1 个答案:

答案 0 :(得分:0)

<input type="submit" name="" value="Register">
<input type="reset" name="" value="Reset">

应表示为按钮。 Chrome希望将它们明确声明为<button>

<button type="submit">Register</button>
<button type="reset">Reset</button>

这是您提供的代码的改进版本,其中包含一些修复程序。您可以遵循如何正确构造<form> via MDN的方法。

<form method="GET">
  <input type="radio" name="gender" value="male" id="male"><label for="male">Male</label> <br>
  <input type="radio" name="gender" value="female" id="female"><label for="female">Female</label> <br>
  <input type="radio" name="gender" value="other" id="other"><label for="other">Other</label> <br> Pets <br>
  <input type="checkbox" name="dog" value="" id="dogs"><label for="dogs">Dogs</label><br>
  <input type="checkbox" name="cat" value="" id="cats"><label for="cats">Cats</label>
  <br> Cars <br>
  <select class="" name="cars">
    <option value="volvo" name="volvo">Volvo</option>
    <option value="Audi" name="audi">Audi</option>
  </select><br>
  <button type="submit">Register</button>
  <button type="reset">Reset</button>
</form>