点击并按住可排序功能

Sortable function on click and hold

本文关键字：排序 功能      更新时间：2023-09-26

这是我的第一个问题，所以我想说你好：）我真的很喜欢stackoverflow，你是我的编码专家：）

但现在我遇到了一个问题，我在整个互联网上都找不到任何答案：p

我有可排序的div，它运行良好（$（"#sortable"）.sortable（）；）

现在我想让它可以排序，但只有当我点击并按住一个名为"移动"的按钮时。任何其他对div的点击都不应该使div的可排序。

每个可分拣分区内都有带按钮的分区。

示例代码：

<div id="sortable">
    <div id="first">
          <img src="...">
          <button>Move</button>
    </div>
    <div id="second">
          <img src="...">
          <button>Move</button>
    </div>
    <div id="third">
          <img src="...">
          <button>Move</button>
    </div>
</div>

你知道怎么处理这个吗？我试过在鼠标悬停或点击按钮时更改id（从无到可排序），但没有成功。

非常感谢：）顺致敬意，Krzysiek

当然，您可以使用handle选项将"排序开始"点击限制为特定元素：

$( "#sortable" ).sortable({
  handle: "button",
  cancel: ""
});


$("#sortable").sortable({
  handle: 'button',
  cancel: ''
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js"></script>
<div id="sortable">
  <div id="first">
    <img src="...">
    <button>Move</button>
  </div>
  <div id="second">
    <img src="...">
    <button>Move</button>
  </div>
  <div id="third">
    <img src="...">
    <button>Move</button>
  </div>
</div>

我希望这对你有帮助。

相关文章：