这里是长期读者和第一次发帖,对 jQuery/jQM 有点陌生。
我有一个包含带有数据过滤器的 ListView 的表单,其中每个列表项都包含一个复选框。当我在过滤框中输入内容并过滤项目时,背景中会出现额外的无样式复选框。这是代码示例:
<div data-role="content">
<ul data-role="listview">
<fieldset data-role="controlgroup" id="myGroup" data-filter="true" data-icon="false">
<li>
<input type="checkbox"
name="itemIds"
id="228"/>
<label for="228">
Orange
</label>
</li>
<li>
<input type="checkbox"
name="itemIds"
id="70"/>
<label for="70">
Red
</label>
</li>
<li>
<input type="checkbox"
name="itemIds"
id="71"/>
<label for="71">
Blue
</label>
</li>
<li>
<input type="checkbox"
name="itemIds"
id="72"/>
<label for="72">
Purple
</label>
</li>
</fieldset>
</ul>
</div>
我最初认为问题出在我动态生成列表的方式上(即我认为我一定得到了重复的复选框,因为无样式的复选框对应于我的列表中的项目),但我能够重现该问题在 jsfiddle 中使用上面的简单代码示例:http://jsfiddle.net/KsRb2/2/
任何帮助将不胜感激。谢谢!
最佳答案
此行为是 jQM 1.4.0 alpha 2 中的错误。您应该更新到 1.4.0 RC1 并删除 ul 和 li 标记,因为此列表只能是 ListView 或控制组,不能同时是两者。这将是最终的 HTML:
<div data-role="content">
<fieldset data-role="controlgroup" id="myGroup" data-filter="true" data-icon="false">
<input type="checkbox"
name="itemIds"
id="228"/>
<label for="228">
Orange
</label>
<input type="checkbox"
name="itemIds"
id="70"/>
<label for="70">
Red
</label>
<input type="checkbox"
name="itemIds"
id="71"/>
<label for="71">
Blue
</label>
<input type="checkbox"
name="itemIds"
id="72"/>
<label for="72">
Purple
</label>
</fieldset>
</div>
您可以在这里用 fiddle 尝试一下:http://jsfiddle.net/KsRb2/5/
关于javascript - jQuery Mobile - 过滤复选框 ListView 会导致出现无样式的复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20432467/