jQuery UI 对话框 option() 方法

jQuery UI 是一个流行的 JavaScript 库，提供了许多用户界面组件，其中之一是对话框组件。对话框组件可以显示各种信息以及用户交互，例如警告、确认和提示。其中 option() 方法是用于设置和获取对话框的属性。

语法

$(selector).dialog("option", optionName);
$(selector).dialog("option", optionName, [value]); 
$(selector).dialog("option", options); 

参数

• optionName: 必需。要设置或获取的选项的名称。
• value: 可选。设置选项的值。
• options: 可选。一个包含一个或多个选项名称及其值的对象。

返回值

如果使用 optionName 参数，则该方法返回匹配元素的选项值。如果使用 options 参数，则该方法返回与当前选项匹配的选择器的所有元素。如果使用 value 参数，则该方法将设置匹配元素的选项值并返回选择器。

实例

$( "#dialog" ).dialog({
  autoOpen: false,
  buttons: {
    Ok: function() {
      $( this ).dialog( "close" );
    },
    Cancel: function() {
      $( this ).dialog( "close" );
    }
  }
});

$( "#opener" ).click(function() {
  $( "#dialog" ).dialog( "open" );
});

$( "#change-button-text" ).click(function() {
  $( "#dialog" ).dialog( "option", "buttons.Ok", { text: "Accept" });
});

以上代码将创建一个对话框，其中含有两个按钮，点击这些按钮将关闭对话框。第一个按钮的文本为“Ok”，第二个按钮的文本为“Cancel”。autoOpen 选项设置为 false，因此对话框不会在页面加载时自动打开。然后，当单击触发器元素 #opener 时，它将打开对话框。单击 #change-button-text 元素时，则会将“Ok”按钮的文本更改为“Accept”。

总结

option() 方法是一个方便的方法，可以用于设置和获取对话框的属性。它可以采用选项名称和选项值的组合，也可以采用选择器和多个选项的组合。学习此方法可以更好地理解如何使用 jQuery UI 对话框组件。