jQuery UI Draggable 禁用选项

介绍

jQuery UI Draggable 是一个可拖拽的 jQuery UI 组件，它可以使你能够轻松地将任何元素变成可拖拽的。而禁用选项则能够使你临时禁用 Draggable 的拖拽功能。

使用

禁用选项有两种使用方式，一种是在初始化选项中设置，另一种是通过 API 调用。

初始化选项设置

在初始化选项中，可以添加一个 disabled: true 选项来禁用 Draggable：

$( "#draggable" ).draggable({
  disabled: true
});

API 调用

在程序运行时，通过 API 调用 disable() 和 enable() 方法来禁用和启用 Draggable：

$( "#draggable" ).draggable( "disable" ); // 禁用
$( "#draggable" ).draggable( "enable" ); // 启用

例子

以下是一个例子，当点击按钮后，禁用 Draggable 的拖拽功能：

<div id="draggable" class="ui-widget-content">
  <p>Drag me around</p>
</div>
<button id="disable-draggable">Disable Draggable</button>

<script>
  $( "#draggable" ).draggable();
  $( "#disable-draggable" ).on( "click", function() {
    $( "#draggable" ).draggable( "disable" );
  });
</script>

总结

禁用选项是 jQuery UI Draggable 的一个非常实用的功能，它可以让您临时禁用拖拽功能，从而更好地控制您的页面交互。