1

我有一个如下的html。

<tr class="meta-info" id="${page.id}">
    <td>
        <div class="pull-left">
         <font size="1">
             <a href="javascript:void(0)" class="like">Like</a>
         </font>
         </div>
         <div class="pull-right" style="font-size:1">
         <span class="badge"><i class="icon-thumbs-up"></i>1</span>          
         </div>
    </td>
</tr>

当用户单击 Like 超链接时，我正在尝试增加喜欢的数量。

这是我的jQuery代码。我想知道如何从 jquery 对象中获取 html 元素。

$(".like").click(function(event){
    var parentTr = $(event.target).closest("tr");
    if(parentTr.length){
        var pageId = parentTr.attr("id");
        var spanEle = parentTr.get(0)+" div span:first-child"; ------(1)
        var lastNumber =  parseInt(spanEle.text());
        spanEle.text(lastNumber+1);
    }
});

我不知道我在标记为 1 的线上做得是否正确。

4

3 回答 3

0

尝试：小提琴

var lastNumber = parseInt(parentTr.find('.pull-right span').text(), 10);

您的代码将如下所示：

$(".like").click(function(event) {
    var parentTr = $(event.target).closest("tr");
    if (parentTr.length) {
        var pageId = parentTr.attr("id");
        var spanEle = parentTr.find('.pull-right span');
        var lastNumber =  parseInt(spanEle.text(), 10);
        spanEle.text(lastNumber + 1);
     }
});

更新：如果您希望保留<i>标签，请使用：

spanEle.html(spanEle.html().replace(lastNumber, lastNumber + 1));

代替 ：spanEle.text(lastNumber + 1);

样本

于 2013-03-12T10:15:00.487 回答
0

试试这个...

$(".like").click(function(event) {
    var parentTr = $(event.target).closest("tr");
    if (parentTr.length) {
        var pageId = parentTr.attr("id");
        var spanEle = parentTr.first('.badge');
        var lastNumber =  parseInt(spanEle.text(), 10);
        spanEle.text(lastNumber + 1);
    }
});

如果 span 元素始终具有该类名，那么它将找到第一个（唯一？）一个并返回其中文本的 int 值。

于 2013-03-12T10:16:29.240 回答
0

我认为您需要添加一个额外的<span>标签，以便您可以在不触摸相邻图标的情况下替换计数

<span class="badge"><i class="icon-thumbs-up"></i>
    <span class="like-count">1</span>
</span>

那么你可以解决它

$(".like").click(function() {
    var spanEle = $(this).closest('tr').find('.like-count').first();
    if (spanEle.length) {
        var newCount = parseInt(spanEle.text());
        spanEle.text(newCount + 1);
    }
});

在事件处理程序中，this引用是event.target. 您可能能够处理元素不存在的情况也比这更整洁，但这种方式是安全的。

JSFiddle 演示：http: //jsfiddle.net/rupw/VfCvK/

于 2013-03-12T10:39:21.203 回答