“已检查"如果html是动态创建的，则checkbox的属性不会启用 [英] The "checked" attribute of checkbox does not get enabled if the html is created dynamically
问题描述
我创建了一个包含复选框的列表视图.在一些列表项中，我希望选中该复选框.内容来自服务器时，将动态创建listview.
I have created a listview containing checkbox. On few of the list items I wanted the checkbox to be checked. The listview is created dynamically as the content comes from the server.
我有以下jsfiddle代码. http://jsfiddle.net/praleedsuvarna/rN28z/
I have the following jsfiddle code. http://jsfiddle.net/praleedsuvarna/rN28z/
您能帮我解决这个问题吗?预先感谢
Can you please help me solve this problem? Thanks in advance
下面是我的动态列表内容的示例，其中第二和第三复选框设置为已选中"
below is an example of my dynamic list content where the 2nd and 3rd checkbox is set to "checked"
$(document).on('pageshow', '#index', function(){
var list = '<li>'+
' <div class="checkBoxLeft">'+
' <input type="checkbox" name="checkbox-0" id="checkbox-0" class="hidden-checkbox"/>'+
' </div> '+
' <a href="item1.html" class="detailListText">item1</a>'+
'</li>'+
'<li>'+
' <div class="checkBoxLeft">'+
' <input type="checkbox" name="checkbox-0" id="checkbox-0" class="hidden-checkbox" checked="checked"/>'+
' </div>'+
' <a href="item1.html" class="detailListText">item2</a>'+
'</li>'+
'<li>'+
' <div class="checkBoxLeft">'+
' <input type="checkbox" name="checkbox-0" id="checkbox-0" class="hidden-checkbox" checked="checked"/>'+
' </div> '+
' <a href="item1.html" class="detailListText">item3</a>'+
'</li>'
$("#viewdata").html(list);
$("#viewdata").listview("refresh");
});
下面是我的html页面
below is my html page
<body>
<div data-role="page" id="index">
<div data-theme="a" data-role="header">
<h3>
First Page
</h3>
<a href="#second" class="ui-btn-right">Next</a>
</div>
<div data-role="content">
<ul data-role="listview" data-theme="a" id="viewdata">
</ul>
</div>
<div data-theme="a" data-role="footer" data-position="fixed">
</div>
</div>
</body>
推荐答案
修复并稍作清理的版本: http ://jsfiddle.net/rN28z/6/
Fixed and a little cleaned up version: http://jsfiddle.net/rN28z/6/
我移动了这段代码:
$('input[type="checkbox"]').each(function() {
$(this).parent('.checkBoxLeft').addClass(this.checked ? 'checked' : 'not-checked');
});
内部pageshow处理程序.您是在pagebeforeshow上调用它的，那时您的HTML尚未填充.
inside pageshow handler. You were calling it on pagebeforeshow and by that time your HTML had not been yet populated.
这篇关于“已检查"如果html是动态创建的，则checkbox的属性不会启用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
