我试图在我的代码中获取已检查的listitem的索引,但无法找到方法。我的HTML代码如下 -
<h2 data-dojo-type="dojox/mobile/RoundRectCategory">Select Your Range :</h2>
<ul id="list" data-dojo-type="dojox/mobile/RoundRectList" data-dojo-props='select:"single"'>
<li data-dojo-type="dojox/mobile/ListItem" data-dojo-props='checked:true'>Within 1 KM</li>
<li data-dojo-type="dojox/mobile/ListItem" >Within 3 KM</li>
<li data-dojo-type="dojox/mobile/ListItem" >Within 5 KM</li>
</ul>
我尝试使用dojo.query来访问已检查的listitem,但它也无法正常工作。有人可以帮助我如何实现这个目标吗?
我的道场代码 -
dojo.query("#list>li:checked").forEach(function(node) { alert("in for loop"); });
我尝试使用下面的代码,它为我提供了索引0的警报,该警报对应于默认选择的列表项目但是当我选择任何其他列表项目时,我仍然收到默认选定列表项目的警报。当我查看Google Chrome的开发者工具时,我发现当我选择任何其他listitem时,默认listitem的data-dojo-props ='checked:true'不会更改为false。这是listitem的正确行为吗?理想情况下,它应该变为false并且新选择的listitem的checked属性应该变为'true'但是这不会发生。任何人都可以解释这种行为,并告诉我获得所选listitem的索引的最佳方法?
dojo.query("#list>li[data-dojo-props='checked:true']").forEach(function(node,index) { alert("in for loop"+ index); });
注意 - 我在我的listitems中使用了dojo radiobutton,但效果非常好,但仍然希望获得有关此功能的帮助。
答案 0 :(得分:-1)
使用JQuery。
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>
<body>
<h2 data-dojo-type="dojox/mobile/RoundRectCategory" >Select Your Range :</h2>
<ul id="list" data-dojo-type="dojox/mobile/RoundRectList" data-dojo-props='select:"single"'>
<li data-dojo-type="dojox/mobile/ListItem" data-dojo-props='checked:true'>Within 1 KM</li>
<li data-dojo-type="dojox/mobile/ListItem" data-dojo-props='checked:true' >Within 3 KM</li>
<li data-dojo-type="dojox/mobile/ListItem" >Within 5 KM</li>
</ul>
<input type="button" value="get selected items" onclick="GetData()" />
<script type="text/javascript">
function GetData(){
var Value = "";
$("#list li").each(function(index,ele){
if($(ele).attr("data-dojo-props") === "checked:true")
Value += ","+$(ele).html();
});
alert(Value);
}
</script>
</body>