使用 jQuery forEach 查找原始点击发生的位置

Question

我有一个

列表，其中可能会产生一些点击。我知道如何用这样的方式滚动它们：

        $('p').each(function() { 

        });

但我不明白的是如何获取这些段落中某些项目的值。我正在此处查看 API 的属性： http://api.jquery.com/category/attributes/ 但不知怎的，我没有看到太多相关的东西。

这是我的

的典型内容，

<p class="half_text">0 
    <strong>
      <a class="vote_up" style="color: #295B7B; font-weight:bold;" href="#" data-problem_id="48">Vote Up</a>
    </strong> 
    | 0 
    <strong>
        <a class="vote_down" style="color: #295B7B; font-weight:bold;" href="#" data-problem_id="48">Vote Down</a>
    </strong>
</p>

我需要做的是增加或减少“half_text”内或 | 之后的 0。整个事情的中心人物。我可以将它们包装在 span 标记内，但是如何将 span 标记与特定

的 data-problem_id="48" 部分相匹配？

谢谢！！

Answer 1

我建议您将值包装成跨度以便于阅读：

<p class="half_text">
    <span class="votes_up">
        0 
    </span>
    <strong>
      <a class="vote_up" style="color: #295B7B; font-weight:bold;" href="#" data-problem_id="48">Vote Up</a>
    </strong> 
    |  
    <span class="votes_down">
        0 
    </span>
    <strong>
        <a class="vote_down" style="color: #295B7B; font-weight:bold;" href="#" data-problem_id="48">Vote Down</a>
    </strong>
</p>

然后，脚本更简单且更易于阅读：

$('p.half_text a.vote_up').click(function(e){
    e.preventDefault();
    var votes = $(this).closest('span.votes_up');
    votes.text((+votes.text() || 0) + 1);
});
$('p.half_text a.vote_down').click(function(e){
    e.preventDefault();
    var votes = $(this).closest('span.votes_down');
    votes.text((+votes.text() || 0) + 1);
});

Answer 2

您根本不需要使用each 循环。如果您甚至要处理链接上的点击，您可以执行以下操作：

var $this = $(this);
var p = $this.parentsUntil('p');
if($this.hasClass('vote_up')){
    $this.text(parseInt($this.text, 10) + 1);
}
else {
    $this.text(parseInt($this.text, 10) - 1);
}

Answer 3

$('.vote_up').click(function(event) {
  var span = $(event.target).parent().find('.yourSpanClass');
  span.html(parseInt(span.html())+1);
};

我将为您留下为 vote_down 做同样的事情。

Answer 4

我想这就是你想要的 http://jsfiddle.net/7T4AK/

我添加了 spans 这样您就可以轻松访问需要递增的数字。
这应该会让您走上正确的道路，弄清楚如何对否决票做同样的事情。

$('a.vote_up').click(function(){
    var span = $(this).closest('p').find('span.up');
    span.text(parseInt(span.text(),10) + 1);
});

Answer 5

$('p').click(function(e){
    alert( $(e.target).html() );
});

从这里开始工作..

Answer 6

您应该将数字包装在 标记中，然后您可以执行以下操作：

$('a', 'p.half_text').click(function(e) {
    var $this = $(this), $p = $this.closest('p.half_text'), $num, chg = 1;
    if($this.hasClass('vote_up')) {
        $num = $p.find('span.up');
    }
    else if($this.hasClass('vote_down')) {
        $num = $p.find('span.down');
        chg = -1;
    }
    $num.text(parseInt($num.text(), 10) + chg);
});

演示：http://jsfiddle.net/gRLad/7/