jQuery Mobile Collapsibleset disable() 方法

简介

disable() 方法用于禁用 jQuery Mobile Collapsibleset 组件中的指定可折叠区块。禁用后的区块将无法被展开或收拢，同时组件的样式也会相应改变以反映其被禁用的状态。

该方法在 jQuery Mobile 1.4.0 版本中被引入。

语法

$( ".selector" ).collapsibleset( "disable", index );

• selector：必需，指定要禁用的可折叠区块元素。
• index：可选，指定要禁用的区块在组件中的索引。如果省略该参数，则默认禁用组件中的所有可折叠区块。

实例

以下代码演示了如何使用 disable() 方法禁用一个 jQuery Mobile Collapsibleset 的某个可折叠区块：

<div data-role="collapsibleset">
  <div data-role="collapsible">A</div>
  <div data-role="collapsible">B</div>
  <div data-role="collapsible">C</div>
</div>

<button id="btnDisable">禁用第2个可折叠区块</button>

<script>
$(function() {
  $("#btnDisable").click(function() {
    $(".ui-collapsible:eq(1)").collapsible("disable");
  });
});
</script>

在上述代码中，点击按钮后将会禁用上述可折叠区块中的第二个区块（“B”）。注意，我们使用了 $(".ui-collapsible:eq(1)") 来选中第二个可折叠区块，而不是直接使用 $("div:eq(1)") 之类的选择器。这是因为 jQuery Mobile 会动态地将第二个可折叠区块转换为一个更复杂的 HTML 结构，并赋予其一些特殊的 CSS 类名，所以需要使用 $(".ui-collapsible:eq(1)") 这样的选择器来选中它。

注意事项

• 禁用一个可折叠区块时，该区块的状态（即展开或收拢状态）不会改变，但点击区块时仍然不会触发其展开或收拢的事件。
• 如果要启用一个之前已经禁用的区块，可以使用 enable() 方法。