2015-01-03 35 views
0

我是一个相当新的JavaScript和jQuery。jQuery不能使用父元素.parent()

我在写一个网站,使用AJAX来更新文件的评级到服务器。这个想法是,当我得到响应(即成功或失败)时,我应该更新表的一些值。但是,我遇到了很多麻烦,因为我似乎无法正确导航DOM。

我的HTML感兴趣的片段是这样的:

<tr> 
    <td><a href="some_url">some_name</a></td> 
    <td>Yes</td> 
    <td>Tag</td> 
    <td>0</td> 
    <td>0</td> 

    <td><button value="UP" onClick="rate(this, 'some_key', 'upvote', 'some_url');"> 
      <span class="glyphicon glyphicon-thumbs-up" style="font-size: 1.2em"></span> 
     </button> 
     <button value="DOWN" class="btn btn-default down_vote_button table-buttons" onClick="rate(this, 'some_key', 'downvote', 'some_url');"> 
      <span class="glyphicon glyphicon-thumbs-down" style="font-size: 1.2em"></span> 
     </button> 
     </td> 
</tr> 

我的jQuery如下:

function rate(caller, key, action, action_url){ 
    $.ajax({ 
     type: "POST", 
     url: action_url, 
     dataType: 'json', 
     data: JSON.stringify({"key": key, "action": action }) 
    }) 
    .done(function(data) { 
     if(action == 'upvote') { 
      var upvotes = $(caller).parent("tr").eq(3).text(); 
      alert("upvoted: " + upvotes); 
     } else if(action == 'downvote') { 
      var downvotes = $(caller).parent("tr").eq(4).text(); 
      alert("downvoted: " + downvotes); 
     } 
    }) 
    .fail(function(data) { 
     alert("File action '" + action + "' failed. Please try again later."); 
    }); 
}; 

我的想法是,如果有从一个成功的返回码服务器然后我传递一个引用触发动作的按钮(因此调用rate(this,....)),然后我应该得到该按钮的父对象,并最终获得正确的索引,以便我可以获取文本。但是,由于某种原因,我从来没有真正获得过文本。我试图得到按钮的父母,我也无法得到它。

请注意,该表应该有很多条目,并可以根据存储在数据库中的内容而有所不同。

帮助将不胜感激。

谢谢!

回答

2

首先你的按钮没有parent('tr'),它的父母是<td>。一个元素只有一个父,它被包含在单个元素

我怀疑你想要的东西,如:。

var upvotes = $(caller).closest("tr").find('td').eq(3).text(); 

这看起来这棵树到最近tr然后查找使用find该行内定位td具有索引= 3

参考:closest() API Docs

+0

同时检查变量赋值...... var downvotes',然后在第二次警报中使用'upvotes'。 – rfornal

+0

@rfornal实际上它使用了一个看起来未定义的变量 – charlietfl

+0

正确,我怀疑他打算使用'downvotes'而不是'upvoted'。 – rfornal

0

parent()只查找一个级别。如果您想查找最接近的父代(不一定是直接父代),请使用closest()