Question

我的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);
}
});

我希望向下箭头也可以更改值但是我只想让向上箭头工作。

Answer 1

根据你的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 和输入之间的空格）表示您正在寻找<{1}} 内部具有input type="text"类的元素（不是）。

使用ranky，您可以使用input[type="text"].ranky类来引用输入字段 - 应该是。

尽管其余代码正常运行，但 NOT 对多个元素使用相同的ranky属性。 id-selector必须是独一无二的。我还建议您不要使用id之类的自定义属性。有一个cnt属性用于存储与匹配元素关联的任意数据。例如：

data

然后使用 jQuery's data() method ：

访问它

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

当我交换表行时，我的JQuery函数中的顶行不会改变

1 个答案: