在IE10中，jQuery Mobile Input复选框显示为double

Question

使用jQuery Mobile 1.3。这是我的ASP.Net MVC页面中的Rayzor代码。

<li data-role="fieldcontain">
    @Html.LabelFor(m => m.RememberMe, new { data_theme = "a" })
    @Html.CheckBoxFor(m => m.RememberMe, new { data_theme = "a" })
</li>

生成的HTML在Chrome中渲染，在IE10中看起来也一样：

到目前为止一切顺利。现在，当我在此复选框内单击时，或当我选中控件并按SPACE时，IE开始失败。 IE显示另一个已经存在的复选框。

不对！快速查看浏览器的F12屏幕确实显示HTML中存在此复选框。 Chrome中突出显示了这一点：

用CSS隐藏这个是正确的解决方案吗？如果是这样，我会想象这是一个jQuery错误。我无法弄清楚为什么IE显示这个而Chrome不是。在Chrome中，显示设置为阻止，zindex设置为1.所以我原本希望它也能在Chrome中显示。显然我不想要它;在这种情况下，即使我想要Chrome的行为，IE似乎也是正确的。

Answer 1

检查填充复选框的代码。

JQM的复选框将此输入置于标签之上。像这样......

<div class="ui-checkbox">
    <input type="checkbox" name="checkbox-2a" id="checkbox-2a">
    <label for="checkbox-2a" data-corners="true" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="checkbox-on" data-theme="c" data-mini="false" class="ui-checkbox-on ui-btn ui-btn-hover-c ui-btn-corner-all ui-fullsize ui-btn-icon-left ui-btn-up-c">
        <span class="ui-btn-inner">
            <span class="ui-btn-text">Doritos</span>
            <span class="ui-icon ui-icon-checkbox-on ui-icon-shadow">&nbsp;</span>
        </span>
    </label>
</div>