當我交換錶行時，頂級行不會改變我的JQuery函數

我的jquery函數允許我單擊向上箭頭並且它交換表中的行。我在每一行中都有排名數字。我只能得到點擊的數字來改變。我希望兩個號碼都交換。我知道abovecnt的值沒有設置正確。我無法弄清楚如何得到它。現在它只是未定義的。當我交換錶行時，頂級行不會改變我的JQuery函數

http://jsfiddle.net/Thread7/2rmowem4/15/

$('.change-rank').click(function() { 
var cnt = $(this).attr('cnt');              
var direction = $(this).attr('data-direction'), 
    $original = $(this).closest("tr"), 
    $target = direction === "up" ? $original.prev() : $original.next(); 

if ($target.length && direction === "up") { 
    $original.insertBefore($target); 
    abovecnt = $original.find('.ranky input[type="text"]').val(); 
    $('#rank_' + cnt).val(cnt-1); 
    $('#rank_' + abovecnt).val(cnt); 
    alert('abovecnt=' + abovecnt + '|cnt=' + cnt);  
} 
else if($target.length) { 
    $original.insertAfter($target); 
} 
});

我將要向下箭頭更改值也不過ATM我只是想向上箭頭的工作。

來源

2015-02-05 Jenna Samuels

檢查此鏈接了：http://www.safnet.com/writing/tech/2012/07/manipulating-table -rows-with-jquery.html＃該腳本完全正在嘗試做什麼 – ctwheels 2015-02-05 21:32:48

根據你的HTML：

<input type='text' id='rank_1' value='4' class='ranky'>

你有此行的一個問題：

abovecnt = $original.find('.ranky input[type="text"]').val();

這應該是：

abovecnt = $original.find('input[type="text"].ranky').val(); 
// As "id" attribute have to be unique, even better using this: 
abovecnt = $('#rank_1').val();

這是爲什麼？

使用.ranky input[type="text"]（注意：RANKY和輸入之間的空間）意味着，你正在尋找一個input type="text"這是內與ranky類的元素（這是不是）。

使用input[type="text"].ranky您可以參考ranky類的輸入字段 - 應該是這樣。

Althought你的代碼的其餘部分工作正常，你應該不使用相同的id屬性的多個元素。 id-selector必須是唯一的。我還建議你不要使用像cnt這樣的自定義屬性。有一個data屬性來存儲與匹配元素相關的任意數據。例如：

<a href='#' class='change-rank' data-direction='down' data-cnt=4>

，然後訪問它使用jQuery's data() method：

var cnt = $(this).data('cnt');

來源

2015-02-05 21:31:34

謝謝。我修改了它，現在運行良好 - http://jsfiddle.net/Thread7/6r63nLm4/55/ – 2015-02-06 16:24:16

當我交換錶行時，頂級行不會改變我的JQuery函數

回答

相關問題