jQWidgets jqxWindow closeAll() 方法

简介

closeAll() 方法是 jQWidgets jqxWindow 组件的一个函数，用于关闭页面上的所有 jqxWindow 组件实例。

语法

$('#myWindow').jqxWindow('closeAll');

参数

该方法无需传递任何参数。

示例

示例 1

在页面上创建两个 jqxWindow 组件，然后分别给他们的“关闭”按钮绑定 closeAll() 方法，点击按钮时可以关闭所有的 jqxWindow 组件。

<div id="window1">
  <div>窗口 1</div>
  <div>这是窗口 1 的内容</div>
  <div>
    <input type="button" value="关闭" id="btnClose1" />
  </div>
</div>

<div id="window2">
  <div>窗口 2</div>
  <div>这是窗口 2 的内容</div>
  <div>
    <input type="button" value="关闭" id="btnClose2" />
  </div>
</div>

// 创建窗口 1
$('#window1').jqxWindow({
  width: 400,
  height: 200
});

// 创建窗口 2
$('#window2').jqxWindow({
  width: 400,
  height: 200
});

// 给窗口 1 的“关闭”按钮绑定 closeAll() 方法
$('#btnClose1').on('click', function () {
  $('#window1').jqxWindow('closeAll');
});

// 给窗口 2 的“关闭”按钮绑定 closeAll() 方法
$('#btnClose2').on('click', function () {
  $('#window2').jqxWindow('closeAll');
});

示例 2

页面上有多个 jqxWindow 组件，需要在点击某一个 jqxWindow 组件时关闭其它所有 jqxWindow 组件。

<div id="window1">
  <div>窗口 1</div>
  <div>这是窗口 1 的内容</div>
</div>

<div id="window2">
  <div>窗口 2</div>
  <div>这是窗口 2 的内容</div>
</div>

<div id="window3">
  <div>窗口 3</div>
  <div>这是窗口 3 的内容</div>
</div>

// 创建窗口 1
$('#window1').jqxWindow({
  width: 400,
  height: 200
});

// 创建窗口 2
$('#window2').jqxWindow({
  width: 400,
  height: 200
});

// 创建窗口 3
$('#window3').jqxWindow({
  width: 400,
  height: 200
});

// 给每一个 jqxWindow 组件绑定 click 事件
$('#window1, #window2, #window3').on('click', function () {
  // 遍历所有 jqxWindow 组件实例
  $.each($.find('.jqx-window'), function (index, value) {
    // 如果当前组件不是当前点击的组件，则关闭
    if (value.id !== this.id) {
      $(value).jqxWindow('close');
    }
  });
});

以上是 jQWidgets jqxWindow closeAll() 方法的完整攻略，包含了方法的语法、参数、示例等详细内容。