1

我想在 html 代码中删除其中一行（例如：Row 2）后，通过 jQuery 更改为 in name 元素。

例如，我们首先在 html 中有：

第 1 行： name="check[ 0 ][]"
第 2 行（已删除）： name="check[ 1 ][]"
第 3 行： name="check[ 2 ][]"
第 4 行： name="check[ 3 ][]"

现在如果我们删除第二行，事实上，在删除第 2 行之后，我们有这样的行：

第 1 行： name="check[ 0 ][]"
第 3 行： name="check[ 2 ][]"
第 4 行： name="check[ 3 ][]"

但是我希望它在结果中（在删除其中一行例如：第 2 行之后）为：

第 1 行： name="check[ 0 ][]"
第 3 行： name="check[ 1 ][]"
第 4 行： name="check[ 2 ][]"

我试过了（见我的完整代码）但不工作：http: //jsfiddle.net/k3wne/

JS：

$('.remove_input').live('click', function (e) {
    e.preventDefault();
    var remove = $(this).closest($class);
    remove.fadeOut('slow', function () {
        $('.add_units').each(function (idx, val) {
            var num = $('.add_units').length;
            NumIdx = (num - (num - idx));
            //for(var i = 0; i < num-1; i++){
            $(this).closest($class_guide).next($class_guide).each(function (idx, val) {
                $('.add_units input[type="checkbox"]').attr('name', function (idx, str) {
                    var int = parseInt(str.match(/\d+/)[0], 10);
                    return str.replace(int, NumIdx);
                })
            });
            //}
        })
    });)
}​
4

3 回答 3

2

Here

DEMO

$('.remove_input').live('click', function (e) {
    e.preventDefault();
    var remove = $(this).closest('.RowCheck');
    remove.fadeOut('slow', function () {
        $(this).remove(); // or change next line to  $('.RowCheck:visible')
        $('.RowCheck').each(function (idx) {
            var checkBoxes = $('input[type="checkbox"]',this);
            checkBoxes.each(function(i) {
              var str = $(this).attr('name');  
              var currentIdx = parseInt(str.match(/\d+/)[0], 10);  
              $(this).attr('name', str.replace(currentIdx,idx));
           })
        });
    });
});​

This code will work if you either

  1. remove the row for real - also suggested by Explosion Pills or
  2. test for visible like Simon did
于 2012-12-19T16:03:13.137 回答
1

你们中的大多数代码都是正确的，但是需要进行一些更改：

更改为使用$('.RowCheck:visible').each() as fadeOut 只是隐藏该行但没有真正删除，内部循环应使用$('input[type="checkbox"]', this)

代码如下所示：

$('.remove_input').live('click', function (e) {
    e.preventDefault();
    var remove = $(this).closest('.RowCheck');
    remove.fadeOut('slow', function () {
        debugger;
        $('.RowCheck:visible').each(function (idx, val) {
            var num = $('.RowCheck:visible').length;
            NumIdx = (num - (num - idx));
            //for(var i = 0; i < num-1; i++){
            //$(this).closest('.RowCheck').next().each(function (idx, val) {
                $('input[type="checkbox"]', this).attr('name', function (idx, str) {
                    var int = parseInt(str.match(/\d+/)[0], 10);
                    return str.replace(int, NumIdx);
                })
            //});
            //}
        });
    });
});​

演示

于 2012-12-19T16:19:14.847 回答
1

http://jsfiddle.net/k3wne/1/

有几件事：一旦元素淡出，你就永远不会真正删除元素，这会搞砸你的计数，最后一个选择器 ( .RowCheck input[type="checkbox"]) 会影响所有复选框，因此它们都将具有最高数字。

在我的更改中，只有迭代中的当前行受到影响。

于 2012-12-19T15:56:26.067 回答