Question

我的代码是这样的：

HTML：

<form action="example3_action.php" name="example3" method="POST">
    <input type="hidden" id='serialize_output' name="serialize_output">
    <div class='span4'>
        box 1 (Customer)
        <ol class='nested_with_switch test1 vertical'>
            <li data-id="1" data-name='Valentino Rossi'>Valentino Rossi</li>
            <li data-id="2" data-name='David Beckham'>David Beckham</li>
            <li data-id="3" data-name='Eden Hazard'>Eden Hazard</li>
            <li data-id="4" data-name='Lionel Messi'>Lionel Messi</li>
            <li data-id="5" data-name='Christiano Ronaldo'>Christiano Ronaldo</li>
            <li data-id="6" data-name='Frank Lampard'>Frank Lampard</li>
        </ol>
    </div>

    <div class='span4'>
        box 2 (Room Type)
        <ol class='nested_with_switch test2 vertical'>
            <li data-id="1" data-name='Single Room' class='highlight'>Single Room<ol></ol></li>
            <li data-id="2" data-name='Double Room' class='highlight'>Double Room<ol></ol></li>
            <li data-id="3" data-name='Family Room' class='highlight'>Family Room<ol></ol></li>
        </ol>
    </div>
    <!--<button type="submit" name="submit">Save</button>-->
</form>

Javascript：

var oldContainer;
    var group = $("ol.nested_with_switch").sortable({
      group: 'nested',
      afterMove: function (placeholder, container) {
        if(oldContainer != container){
          if(oldContainer)
            oldContainer.el.removeClass("active");
          container.el.addClass("active");

          oldContainer = container;
        }
      },
      onDrop: function ($item, container, _super) {

      var data = group.sortable("serialize").get();

      var jsonString = JSON.stringify(data, null, ' ');
      console.log(jsonString);
      $('#serialize_output').val(jsonString);

        container.el.removeClass("active");
        _super($item, container);
      }
    });

演示：https://jsfiddle.net/oscar11/wyyzz9bt/3/

我想要限制阻力＆amp;像这样掉落：http://imgur.com/wIFwON3

我试着这样：

$("ol.test2").sortable({
        group:  'nested',
        drop: false,
        drag: false,
    });
    $("ol.test2>li>ol").sortable({
        group:  'nested',
        drop: true,

    });

但它不能正常工作

有什么建议可以解决我的问题吗？

谢谢

Answer 1

这是你在找什么？ https://jsfiddle.net/wyyzz9bt/5/

我刚刚将nested_with_switch类移到了嵌套的<ol>

如何限制阻力和降？

1 个答案: