jQuery UI 对话框 closeText 选项

在 jQuery UI 对话框中，closeText 选项提供了一个用于自定义 对话框的关闭文本。此选项可为用户提供更好的界面反馈，以及更好的用户体验。

该选项接受一个字符串类型的值，表示想要放置在关闭按钮的文本。默认情况下，该值为 "close"。

用法

可以在创建对话框时，直接指定该选项的值：

$("#myDialog").dialog({
  closeText: "关闭"
});

也可以在创建对话框后，使用 .dialog() 方法进行设置：

$("#myDialog").dialog("option", "closeText", "关闭");

示例

下面是使用默认的 "close" 选项值创建对话框的示例代码：

<div id="dialog" title="我的对话框">
  <p>这里是对话框内容。</p>
</div>

<button id="btnOpenDialog">打开对话框</button>

$(document).ready(function() {
  $("#dialog").dialog({
    autoOpen: false
  });

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

若要将关闭按钮的文本更改为 “关闭此对话框” ，则需要使用 closeText 选项：

$("#dialog").dialog({
  autoOpen: false,
  closeText: "关闭此对话框"
});

效果

参考下面两张截图，可以看出如果将关闭按钮文本从默认的 “close” 改为 “关闭此对话框” ，对话框的右上角关闭按钮的文本也随之改变了。

使用默认选项值：

使用 closeText 选项：

总之，阅读本文，你应该可以理解 closeText 选项并熟练使用该选项来自定义对话框的“关闭”文本。