您好,我正在动态填充 ul - li HTML 标记中的列表。我只需要获取相应 ul 的选定 li 的值。我尝试了所有可能的 jquery 方法,但我仍然未定义。我正在填充 ul - li 为:
jQuery.get(url, function(data) {
for(i=0;i<data.length;i++){
//console.log(data[i]) //"+data[i]+"
msg = "<li> <a href=#>"+data[i]+"</a></li>";
document.querySelector('#option1').innerHTML += msg;
}
});
HTML 部分如下:
<body>
<div class="wrap">
<div class="content">
<div class="cate-map">
<ul id="option1" onclick="doSelection()">
</ul>
</div>
</div>
<div class="content2">
<div class="cate-map">
<ul id="option2">
</ul>
</div>
</div>
<div class="clear"></div>
<div class="content3"> <textarea id="content4"></textarea>
</div>
</div>
</body>
onclick 方法如下:
function doSelection(){
var id = $('#option1 li.selected').attr('value');
alert(id);
}
问题是我的 id 值变得“未定义”。
更新
正如大家所建议的那样,我将代码更改为:
填充 ul 为:
jQuery.get(url, function(data) {
for(i=0;i<data.length;i++){
msg = "<li data-input="+data[i]+" class='selected'> <a href=#>"+data[i]+"</a></li>";
document.querySelector('#option1').innerHTML += msg;
}
});
HTML 格式为:
<div class="cate-map">
<ul id="option1" onclick="doSelection()">
</ul>
</div>
Onclick 函数为:
function doSelection(){
alert($('#option1 li.selected').attr('data-input'));
}
现在我得到一个警报值,但我总是得到第一个元素警报。无论我点击哪个元素,仍然总是获得列表的第一个元素。请帮忙。
最佳答案
正如您在@Frédéric Hamidi 的评论中看到的,value
属性在 li
与 ul
一起使用时不存在,因此最好添加你自己的属性然后像这样访问它:
for(i=0;i<4;i++){// use actual data it is just a demo
msg = "<li data-input="+i+" class='selected'> <a href=#>"+i+"</a></li>";
document.querySelector('#option1').innerHTML += msg;
}
$('#option1 li').click(function(){
//console.log($(this).attr('data-input'));
alert($(this).attr('data-input')); // this will alert data-input value.
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrap">
<div class="content">
<div class="cate-map">
<ul id="option1">
</ul>
</div>
</div>
<div class="content2">
<div class="cate-map">
<ul id="option2">
</ul>
</div>
</div>
<div class="clear"></div>
<div class="content3"> <textarea id="content4"></textarea>
关于javascript - 从 ul li jquery 中获取选定的项目,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27523379/