Question

我使用div而不是表格制作了一个行条带表（我讨厌表格）。我想这样做，如果我点击其中一个div我可以抓住它的一个孩子值。

  <div class='row'><!-- I want to click this div -->

         <p>I want this value</p>

         <p>some other val</p>            

  </div>

  <div class='row'>

         <p>I don't want this one</p>

         <p>some other val</p>            

  </div>

如果你有答案，请告诉我。

Answer 1

$('.row').click(function(){
   var value = $(this).find('p').eq(0).text();
});

当然，您可能希望更好地标记内部值以修复内部find()选择器。例如：

<div class="row">
   <span class="row-value">35</span>
   <p>Some descriptive text</p>
</div>
<div class="row">
   <h1>Cool header</h1>
   <span class="row-value">5</span>
</div>

然后你可以使用$(this).find('.row-value').text()并且对选择器没有破坏感觉更好。

Answer 2

这样的事情：

$(".row").click(function(){
    var grabbedValue = $("> p:eq(0)", this).text();
    // do something with grabbedValue;
});

Answer 3

如果你可以把类放到p标签中，这很容易。

  <div class='row'><!-- I want to click this div -->
         <p class="selectable">I want this value</p>
         <p>some other val</p>            
  </div>
  <div class='row'>
         <p>I don't want this one</p>
         <p  class="selectable">some other val</p>            
  </div>
$('.row').click(function(){
  $(this).children(".selectable").function();
})

Answer 4

$('.row').click(function(){
    console.log($(this).children('p').text());
});

Answer 5

$('.row').click(function(){
   $('p', this).each(function(){
      alert($(this).text());
   });

});

Answer 6

$('.row p').bind('click', function(){
   this.value;
});

Jquery - 单击父div时访问childs值

6 个答案: