如何获得跨度动态值Li UL内

Question

我的ASPX代码如下所示：

<ul id="userlist"> 
    <a class="s-test"> 
     <li> 
      <span id="userlistspan" class="tt-User" value="1">Cardiologist</span> 
      <span id="userlistspan1" class="tt-Userss">SPECIALITY</span> 
     </li> 
    </a> 
    <a class="s-test"> 
     <li> 
      <span id="userlistspan" class="tt-User" value="2">Cardio</span> 
      <span id="userlistspan1" class="tt-Userss">SPECIALITY</span> 
     </li> 
    </a> 
</ul> 

我已经尝试了jQuery是这样的：

$('#userlist li #userlistspan').click(function() { 
    $('#txtSearch').val($(this).text()); 
}) 
//here am getting text like Cardio 

我怎样才能获得价值一样value=2从那span？

Answer 1

你的HTML是完全无效的，原因如下：

• 你不能有一个a元素作为ul的直接孩子。 li必须是子元素。
• 您有重复id属性时id应该是同一个文档中唯一的，使用类组元素代替。
• span元素没有value属性，如果要用元素存储自定义数据，请使用data-*属性。
• a元素必须具有href或name属性，但是在这种情况下它们的使用似乎是多余的，因此您可以将其删除。

您需要首先解决所有这些问题：

<ul id="userlist"> 
    <li> 
     <span class="userlistspan tt-User" data-value="1">Cardiologist</span> 
     <span class="userlistspan1 tt-Userss">SPECIALITY</span> 
    </li> 
    <li> 
     <span class="userlistspan tt-User" data-value="2">Cardio</span> 
     <span class="userlistspan1 tt-Userss">SPECIALITY</span> 
    </li> 
</ul> 

那里，您可以点击处理程序附加到.userlistspan类，并使用this关键字引用其引发事件的元素。然后您可以使用data()方法获得data-value，如下所示：

$('#userlist li .userlistspan').click(function() { 
    var $span = $(this); 
    $('#txtSearch').val($span.text()); 
    var value = $span.data('value'); // = 1 or 2, depending on which element you clicked. 
})