渲染jQuery Mobile Checkbox的问题

Question

我在div标签内动态渲染jQuery移动Checkbox。我面临的问题是第一次呈现复选框时它们看起来很小，而第二次加载同一页面时，复选框被正确呈现。

以下是截图示例：

首次加载：

第二次加载：

任何人都可以帮助解决这个jQuery Mobile Checkbox的问题。

下面是单个复选框的渲染代码：

      xmlArr += '<table id="technologyAreas" border="0" style="width: 100%; margin: 0px; padding: 0px; background : #F0EFED">';
            xmlArr += '<tr><td style="width: 55%;background : #F0EFED">';
            xmlArr += '<fieldset id="techAreasCB" data-role="controlgroup" name="technologyAreasCheck" style="background : #F0EFED">';
            xmlArr += '<legend style="font-style: bold; font-size:16px;background : #F0EFED;width:100%"><label style="background : #F0EFED"><b>Areas<b>:</label></legend>';
     xmlArr += '<tr><td><div style="width:100%; background:#F0EFED;"><input type="checkbox" data-mini="true" name="category'+item.categoryid+'" id="checkbox'+item.categoryid+'"  class="techAreasCheckBox" checked="checked"/></td><td class="myTD" style="padding-left:25px;"><label class="techAreasLabel" style="font-weight:100">'+item.categoryname+'</label></div></td></tr>';
 xmlArr += '</fieldset></td></tr></table>';

是否可以删除jQuery Mobile Checkbox CSS？

Answer 1

可以使用data-role =“none”属性覆盖jQuery CSS。

阻止样式化的属性是data-role =“none”

<input type='checkbox' style='display:none' data-role="none" />

请参阅Jquery文档：“防止表单元素的自动初始化”

这对我有用：）