Question

我有一张桌子，上面写着我不知道该怎么办：

<ul id="myTable" >
    <li><span data-myData="01">first value</span></li>
    <li><span data-myData="02">second value</span></li>
</ul>
<button id = "myButton"> click me </button>

在jquery中，选择元素并单击按钮时：

$(document).on('click', '#myButton', function() {  
 var tableLength = $('#myTable li').length;
 for(var m=0; m<=tableLength; m++){
     if($('#myTable li' + ":nth-child(" + (m+1) + ")").hasClass('selected')){
        var valor = $('#myTable li' + ":nth-child(" + (m+1) + ")").text(); //works
        var id = $('#myTable li' + ":nth-child(" + (m+1) + ")").attr("data-myData"); // doesnt work

     }
   } 
});

我如何获得值

Answer 1

使用此#myTable li' + ":nth-child(" + (m+1) + ")，您可以选择li而不是span。 jquery文本函数适用于li，实际上它重写了li的内容并删除了内部的span。

将此#myTable li' + ":nth-child(" + (m+1) + ")"更改为此#myTable li' + ":nth-child(" + (m+1) + ") span"

Answer 2

您的代码的主要问题是private final BooleanBinding lightIsTurnedOn; private final BooleanProperty buttonA= new SimpleBooleanProperty(false); private final BooleanProperty buttonB = new SimpleBooleanProperty(false);属性位于data，而不是span，因此您的代码会返回li。

另请注意，您可以使用undefined和each()选择器来整理代码，以避免:gt中的第一个li。试试这个：

＆＃13;

ul

＆＃13;

$(document).on('click', '#myButton', function() {
  $('#myTable li:gt(0)').each(function() {
    var $li = $(this);
    var valor = $li.text();
    var id = $li.find('span').data('mydata'); // note data() and lowercase property name
    
    console.log(valor);
    console.log(id);
  });
});

＆＃13;

Answer 3

首先：这不是一张桌子。 UL是一个清单。

其次：简单搜索，简单回答：Get the pure text without HTML element by javascript?

第三：保持简单的JS！

var allSpan = $('#myTable li span') // Contain all span
allSpan.each(function() { console.log(this.innerHTML+ " | "+ this.getAttribute("data-myData")) });

Answer 4

首先它不是一个表，它是<ul>，请在代码段下面找到并将更改属性改为小写，如代码段

$('span').click(function() {
    alert($(this).data('mydata'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ul id="myTable">
  <li><span data-mydata='01'>first value</span></li>
  <li><span data-mydata='02'>second value</span></li>
  <li><span data-mydata='03'>third value</span></li>
</ul>
<button id="myButton">click me</button>

同样可以用于按钮

Answer 5

您可以使用.map

 $("#myTable li span").map(function() {
    var a = $(this).attr("data-myData");
    alert(a);
 }).get();

Answer 6

使用此代码。它将绝对有效：

   $(document).on('click', '#myButton', function() {  
     $.each('#myTable li',function(i,v){
       if($(this).hasClass('selected'))
            {
                 var valor = $(this).find('span').text();
                 var id = $(this).find('span').attr('data-myData');
            }

     });
  });

表元素中的attr值

6 个答案: