Question

http://jqueryui.com/upgrade-guide/1.10/#changed-title-option-from-html-to-text

jQuery UI 1.10使得对话标题只能是文本（无html）以防止脚本漏洞。我不允许用户输入生成这个标题，所以我仍然想使用HTML，主要是在标题左侧显示一个图标。

我将发布我的解决方案来解决这个问题，因为我还没有看到有人问过或回答过这个问题。希望它能帮助其他人，或其他人可能有更好的方法。

有关他们为何这样做的更多信息：http://bugs.jqueryui.com/ticket/6016

Answer 1

这将覆盖设置jQuery UI对话框标题时使用的函数，允许它包含HTML。

$.widget("ui.dialog", $.extend({}, $.ui.dialog.prototype, {
    _title: function(title) {
        if (!this.options.title ) {
            title.html("&#160;");
        } else {
            title.html(this.options.title);
        }
    }
}));

Answer 2

如果你犹豫覆盖jQuery的_title方法，你可以在jQuery对话框的open事件的title元素上使用html，append或类似的方法，如下所示：

$("#element").dialog({
  open: function() {
    $(this).find("span.ui-dialog-title").append("<span class='title'>" + subtitle + "</span>");
  }
});

以上解析了HTML，同时绕过了jQuery的title方法。由于它发生在公开活动中，用户体验仍然是无缝的。刚刚在一个项目中做到了这一点，并且工作得非常好。

Answer 3

这将在初始化对话框后修改标题

$('#element').dialog(options);

var dialogTitle = $('#element').closest('.ui-dialog').find('.ui-dialog-title');
dialogTitle.html('<strong>hello world</strong>');

在jQuery UI 1.10中的Dialog标题中使用HTML

3 个答案: