标签标签有选择下拉列表，在IE11中不起作用

Question

要在IE上测试的HTML代码：

<input name="radiogroup" id="x" type="radio">
<label for="x">
  test
    <select>
      <option value="5">5</option>
      <option selected="selected" value="10">10</option>
      <option value="15">15</option>
    </select>
  </label>

这是一个示例代码

Answer 1

尝试在标签标签外移动选择标签。

<input name="radiogroup" id="x" type="radio">
<label for="x">
  test
</label>
<select>
  <option value="5">5</option>
  <option selected="selected" value="10">10</option>
  <option value="15">15</option>
</select>

Answer 2

您可以将onclick的{​​{1}}事件设置为<select>：

return false

这是有效的，因为使<input name="radiogroup" id="x" type="radio"> <label for="x"> test <select onclick="return false"> <option value="5">5</option> <option selected="selected" value="10">10</option> <option value="15">15</option> </select> </label>事件返回false会使默认浏览器行为不发生，而对于Internet Explorer，默认浏览器行为是您不想要的行为，即关闭右下角用户打开后。

请注意，如果您希望为Internet Explorer以外的其他浏览器执行默认浏览器行为，则可以使用Javascript来测试浏览器是否为Internet Explorer，并且只有在浏览器为Internet Explorer时才返回false（执行此操作的方法）来自this answer）：

onclick

function browserIsIE(){
    if(!!navigator.userAgent.match(/Trident/g) || !!navigator.userAgent.match(/MSIE/g)){
        return true;
    }
    else{
        return false;
    }
}

Javascript代码可以更加优雅，但为了清晰起见，我没有这样做。

请注意，我已经在Chrome，Firefox和Edge中对这两个代码进行了测试，这两个代码在这三种浏览器中的行为完全相同，因此您可以使用上述任何一种代码。

您可以详细了解如何将<input name="radiogroup" id="x" type="radio"> <label for="x"> test <select onclick="if(browserIsIE()){return false}"> <option value="5">5</option> <option selected="selected" value="10">10</option> <option value="15">15</option> </select> </label>与事件here一起使用。