如何在jqm的列表视图中拖放li？

Question

我们可以在查询移动台中拖放列表吗？实际上是在按下按钮后添加列表。我们可以使用查询移动台拖放来更改行的位置吗？我要添加“ tc_1”，“ tc_2” ...等等我们通过拖动“ tc_2”来改变位置，出现“ tc_1”

http://jsfiddle.net/FZQ8D/15/

$(function () {



    $('#addTestCase').click(function () {
       createTestCase("dd",true,"null")

    });
        });

function createTestCase(testCaseName,iscreatedFromScript,jsonObject) {

    var id;
    if (typeof ($("#testCaseContainer li:last").attr('id')) == 'undefined') {
        id = "tc_1";
         var index = id.indexOf("_");
        var count = id.substring(index + 1, id.length);
        count = parseInt(count);
          var conunter = count;




    } else {
        id = $("#testCaseContainer li:last").attr('id');
        var index = id.indexOf("_");
        var count = id.substring(index + 1, id.length);
        count = parseInt(count);
          var conunter = count;



        id = id.substring(0, index) + "_" + parseInt(count + 1);
    }
    var html = '<div class="testcaselist_row">' + '<ul>' + '<li id="' + id + '" class="clickTestCaseRow"><a href="#" style="color: #ffffff!important;">' + id + '</a></li>' + '</ul>' + '</div>';
    $('#testCaseContainer').append(html);




}

Answer 1

您需要添加对jQuery UI的引用并使用可排序功能。 要使其与移动触摸配合使用，您可能需要添加jQuery UI Touch Punch

然后只需将sortable添加到容器中：

$("#testCaseContainer").sortable({
      stop: function( event, ui ) {

      }
}).disableSelection();

更新了FIDDLE