2012-10-10 34 views
1

here獲得新的值是一個的jsfiddlejQuery的Val函數從文本區域

這裏是我的html

<table id="commentsTable"> 
     <tr> 
      <td name="userid"> JIM </td> 
      <td name="comment" id="68" class="commentTD"> something </td> 
      <td><a class="edit" href="#">edit</a></td> 
     </tr> 
</table>​ 

和我的JS:

var update = "update"; 

$("a.edit").click(function(e) { 
    e.preventDefault(); 
    var comment = $(this).closest("tr").find('.commentTD'); 
    comment.html('<textarea name="comment" class="commentArea">' + comment.text() + '</textarea>'); 
    $(this).removeClass().addClass(update).text(update); 
    bindUpdate(); 
}); 

function bindUpdate() { 
    $("a." + update).click(function(e) { 
     e.preventDefault(); 
     var commentNewText = $(this).closest('tr').find('textarea.commentArea').val(); 
     alert(commentNewText); 
    }); 
};​ 

我可以添加一個文本和綁定一個點擊事件,但我似乎無法得到新值,我得到了舊的...

回答

2

問題是,您並未從鏈接中解除舊事件的綁定,因此每次單擊該鏈接時都會添加一個新的textarea,並且只會調用bindUpdate()功能。

看到這個更新的jsfiddle:http://jsfiddle.net/RALDF/8/

編輯:我建議保存的$(this)值到一個變量,並重新使用它,因爲你調用它多次,這對產生負面影響性能/ jQuery需要每次創建新對象$(this)/

+0

這很奇怪。我看到它的工作,但我不明白爲什麼。舊的事件是在'edit'類上,但我正在改變這個類,這樣事件將不再有效。 – devmonster

+0

事件不會綁定到類,而是綁定到元素本身......您不會刪除舊的鏈接元素,只會更改其類和文本,因此仍然會保留第一個綁定的功能 –

+0

hi zathus,仍然很奇怪,這在不久前(上週)。感謝您的快速回復! +感謝關於$(this)元素的其他評論! – devmonster

2

您將在第一個處理程序之前觸發您的第一個處理程序。如果您將unbind添加到第一個處理程序,則它可以正常工作(fiddle)。爲了以更可預測的方式實現這一點,您可以將處理程序提取到單獨的函數中。