Question

您好我正在动态地在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);      
}

问题是我得到了未定义的＆＃39;对于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 ul as：

<div class="cate-map">
    <ul id="option1"  onclick="doSelection()">

    </ul>

    </div>

Onclick功能如下：

function doSelection(){
    alert($('#option1 li.selected').attr('data-input'));

}

现在我得到一个值作为警报，但我总是将第一个元素作为警报。无论我点击哪个元素仍然总是得到列表的第一个元素。请帮忙。

Answer 1

正如您在@ {FrédéricHamidivalue评论中所看到的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>一起使用，因此更好地添加您自己的属性然后访问它这样：

{{1}}

{{1}}

Answer 2

您需要将selected类添加到任何li元素。看看：

msg = "<li class="selected"> <a href=#>"+data[i]+"</a></li>";

获取锚标记的内容：

function doSelection(){
    var id = $('ul#option1 > li.selected a').text();
    alert(id);

}

Answer 3

这会对你有所帮助。您可以使用jquery方法处理选择事件。

 $("#option1 li").click(function() {
     alert($(this).html());
 });

从ul li jquery获取所选项目

3 个答案: