1

最後の 2 つのデモをマージしましたが、競合が発生しています。

これが私の2つのデモです

  1. 複数の入力ボックスを追加する DEMO

  2. 上下に並べ替え -デモ

マージされたデモ

マージされたデモを見ると、並べ替えオプションは最初の入力ボックスでのみ機能しています。つまり、最初のテキスト ボックスのみを上下に移動でき、それぞれのテキスト ボックスの他の上下ボタンはまったく機能しません。

並べ替えの上下のデモとして機能する必要があります。すべてのボタンは、それぞれの入力ボックスを上下に移動するために機能する必要があります。

前もって感謝します！！

コード

$(document).ready(function(){

     $(":radio").click(function(){
         $(".test").hide();
         var show = $(this).attr("data-show");
         $("#"+show).show(300)
     });

        $filtr = $('.filtr');

        $filtr.on('click', '.add', function(){
            $(this).closest('.loop').clone().appendTo( $(this).closest('.test') );
        });

        $filtr.on('click', '.del', function(){
           $(this).closest('.loop').remove();
        });

        $('#1lev, #2lev, #3lev').hide();

     //For sort up/down
     function moveUp(item) {
    var prev = item.prev();
    if (prev.length == 0)
        return;
    prev.css('z-index', 999).css('position','relative').animate({ top: item.height() }, 250);
    item.css('z-index', 1000).css('position', 'relative').animate({ top: '-' + prev.height() }, 300, function () {
        prev.css('z-index', '').css('top', '').css('position', '');
        item.css('z-index', '').css('top', '').css('position', '');
        item.insertBefore(prev);
    });
}
function moveDown(item) {
    var next = item.next();
    if (next.length == 0)
        return;
    next.css('z-index', 999).css('position', 'relative').animate({ top: '-' + item.height() }, 250);
    item.css('z-index', 1000).css('position', 'relative').animate({ top: next.height() }, 300, function () {
        next.css('z-index', '').css('top', '').css('position', '');
        item.css('z-index', '').css('top', '').css('position', '');
        item.insertAfter(next);
    });
}

$(".filtr").sortable({ items: ".loop", distance: 10 });
$('button').click(function() { 
    var btn = $(this);
    var val = btn.val();
    if (val == 'up')
        moveUp(btn.parents('.loop'));
    else
        moveDown(btn.parents('.loop'));
});

});
4

2 に答える 2

1

http://jsfiddle.net/VMBtC/7/をご覧ください。

1行だけ変更しました

$(document).on("click", "button", function() {

これはあなたの要件ですか？あなたのコメントを教えてください。

于 2013-06-11T11:29:03.417 に答える