动态控制组和复选框无样式 [英] Dynamic controlgroup and checkboxes unstyled

问题描述

所以我试图将动态内容直接加载到我的复选框容器 (group_checkboxes) 中

这是我正在运行以填充容器的语句:

$('#group_checkboxes').append('<fieldset data-role="controlgroup"><input type="checkbox" name="' + $(this).find('data').text() + '" class="custom"/><label for="' + $(this).find('data').text() + '">' + $(this).find('label').text() + '</label></fieldset>');

复选框都已填充，但未应用 jQuery 样式.

根据 docs 所有我需要做的是调用这个函数来更新复选框样式...

$("input[type='checkbox']").checkboxradio("refresh");

但这不起作用......知道我做错了什么吗?

解决方案

先试试自己的静态演示代码:

<fieldset data-role="控制组"><legend>选择你喜欢的零食:</legend><input type="checkbox" name="checkbox-1a" id="checkbox-1a" class="custom"/><label for="checkbox-1a">Cheetos</label><input type="checkbox" name="checkbox-2a" id="checkbox-2a" class="custom"/><label for="checkbox-2a">Doritos</label><input type="checkbox" name="checkbox-3a" id="checkbox-3a" class="custom"/><label for="checkbox-3a">Fritos</label><input type="checkbox" name="checkbox-4a" id="checkbox-4a" class="custom"/><label for="checkbox-4a">Sun Chips</label></fieldset>

正如我在评论中提到的，他们只使用了一个字段集.
如果可行，请调整您的脚本以动态生成相同的标记，然后刷新它们

$("input[type='checkbox']").checkboxradio("refresh");

如果这适用于他们的代码，您就会知道您的标记有误.如果不是，则该刷新功能存在错误.(我知道这不是最终的解决方案，但有时您必须进行一些调试:)

发现类似问题，使用Page()
解决JQM 常见问题
SO 问题

So I'm trying to load dynamic content straight into my checkbox container (group_checkboxes)

<div id='group_checkboxes' data-role="fieldcontain">

</div>

This is the statement I'm running to populate the container:

$('#group_checkboxes').append('<fieldset data-role="controlgroup"><input type="checkbox" name="' + $(this).find('data').text() + '" class="custom" /><label for="' + $(this).find('data').text() + '">' + $(this).find('label').text() + '</label></fieldset>');

The checkboxes are all populated but the jQuery style is not applied.

According to the docs all I need to do is call this function to update the checkbox style...

$("input[type='checkbox']").checkboxradio("refresh");

That doesn't work though... Any idea what I'm doing wrong?

解决方案

First try their own static demo code:

<div  data-role="fieldcontain">
                <fieldset data-role="controlgroup">
                    <legend>Choose as many snacks as you'd like:</legend>
                    <input type="checkbox" name="checkbox-1a" id="checkbox-1a" class="custom" />
                    <label for="checkbox-1a">Cheetos</label>

                    <input type="checkbox" name="checkbox-2a" id="checkbox-2a" class="custom" />
                    <label for="checkbox-2a">Doritos</label>

                    <input type="checkbox" name="checkbox-3a" id="checkbox-3a" class="custom" />
                    <label for="checkbox-3a">Fritos</label>

                    <input type="checkbox" name="checkbox-4a" id="checkbox-4a" class="custom" />
                    <label for="checkbox-4a">Sun Chips</label>
                </fieldset>
            </div>

They are using just one fieldset as I mentioned in comments.
If this works, then adjust your script to generate the same markup dynamically and then refresh them

$("input[type='checkbox']").checkboxradio("refresh");

If this will work with their code, you will know that you have error in markup. If not, there is an error with that refresh function. (I know it's not final solution but you have to do a bit of debugging sometimes :)

Edit:
Found similar problems, solved by using Page()
JQM FAQ
SO Question

这篇关于动态控制组和复选框无样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！