2015-01-03 67 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()