刷新JQuery Mobile中的列表视图和复选框

时间:2013-09-30 07:18:15

标签: javascript jquery-mobile checkbox jquery-mobile-listview

我正在网页中动态添加<li>checkBoxes我是JQuery Mobile但是在添加后无法正常查看我尝试使用$('#contactList').listview('refresh'),但它显示错误{ {1}} 这是我的HTML部分

listview is not a function

和我动态添加的JS部分是

<ul data-role="listview" data-inset="true" data-filter="true" data-filter-placeholder="Search" id="contactList">
                </ul>

现在我如何刷新$('#contactList').append('<li>\ <input type="checkbox" name="'+contactId+'" id="'+contactId+'" class="custom" />\ <label for="checkbox-5a">\ <span class="span2 contact-name">\ '+contactName+'\ </span>\ <span class="contact-image">\ <img src="'+contactImage+'"/>\ </span>\ </label>\ </li>') li以便它们看起来正确

更新::我的页面头像是这样的

check boxes

1 个答案:

答案 0 :(得分:0)

您应在label-for中使用与checkbox名称相同的名称

您的代码是

$('#contactList').append('<li>\
                <input type="checkbox" name="'+contactId+'" id="'+contactId+'" class="custom" />\
                <label for="checkbox-5a">\
                    <span class="span2 contact-name">\
                    '+contactName+'\
                    </span>\
                    <span class="contact-image">\
                        <img src="'+contactImage+'"/>\
                    </span>\
                </label>\
            </li>')

但你应该写这个

$('#contactList').append('<li>\
                <input type="checkbox" name="'+contactId+'" id="'+contactId+'" class="custom" />\
                <label for="'+contactId+'">\
                    <span class="span2 contact-name">\
                    '+contactName+'\
                    </span>\
                    <span class="contact-image">\
                        <img src="'+contactImage+'"/>\
                    </span>\
                </label>\
            </li>')