jQueryUI 对话框 - 按钮文本未出现答案

【问题标题】：jQueryUI dialog - button text not appearingjQueryUI 对话框 - 按钮文本未出现
【发布时间】：2011-02-17 15:57:36
【问题描述】：

我的对话框出现了一个奇怪的错误，我正在加载对话框，但是每当我为它分配一个按钮时，虽然它会显示按钮，但它不会显示按钮的名称.这是我成功启动对话框的代码...

jQuery('#'+message_div_id).dialog({
    modal:      ui_popup_modal
,   width:      ui_popup_width
,   height:     ui_popup_height
,   resizable:  false
,   draggable:  false
,   buttons:    {
                    "Ok": function() {
                        jQuery( this ).dialog( "close" );
                    }
                }
});

这是弹出窗口加载后从 bugzilla 生成的 html...

< button type="button" text="Ok" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false">< span class="ui-button-text">< /span>< /button>

span 类是应该包含文本的区域，但如您所见，它不是。有什么想法吗？

【问题讨论】：

你能提供一个jsFiddle吗？我无法重现您的问题。
您确定对话框的高度或宽度足够吗？
无论宽度/高度设置如何，它仍然显示为空白。似乎在途中丢失了按钮的名称。
遇到同样的问题。

标签： jquery-ui jquery-ui-dialog

【解决方案1】：

这给了我很多启发，但它并不完全适合我，我做了以下修改。我认为这效果更好。

$('div.ui-dialog-buttonset button.ui-button span.ui-button-text').each(function() {
    $(this).html($(this).parent().attr('text'));
});

【讨论】：

【解决方案2】：

这适用于我的 jQuery UI v1.8.22 CDN（已测试）：

$('div.ui-dialog button.ui-button').each(function() {
   $(this).children('.ui-button-text').html($(this).attr('text'));
});

【讨论】：

可能只是临时修复，直到它在 UI 库中得到修复。

【解决方案3】：

我认为缺少一些东西。很高兴看到它工作。我尝试创建一个测试，但没有收到任何文本，但缺少 css。如果我这样做，它会起作用：

<button type="button" text="Ok" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">Text Here</span></button>

【讨论】：

最终无法解决它，但是，由于这是更大工作的一部分，我最终做的是... var button1_text = ''; (ui_popup_but1 != '') ？ button1_text = ui_popup_but1 : button1_text = 'OK'; jQuery('button[text="button1"] span').html(button1_text);

【解决方案4】：

抱歉，SO 新手。

无论如何，由于这段代码只是更大功能的一部分，而且我无法通过 jQueryUI 网站上的示例代码解决问题，所以我最终解决了这个问题：

var button1_text = '';

(ui_popup_but1 != '') ? button1_text = ui_popup_but1 : button1_text = 'OK';

jQuery('button[text="button1"] span').html(button1_text);

【讨论】：

【解决方案5】：

我遇到了类似的问题。最后通过将当时使用的 jQuery 版本从 1.3.2 升级到当前（1.7.1）来解决它。我刚刚注意到我使用的 jQuery UI 版本不是最新的（1.8.11 与当前的 1.8.18）。我将尝试将 jQuery 降级并将 jQuery UI 升级到当前版本，看看会发生什么。

编辑：jQuery UI 1.8.18 为我解决了同时使用 jQuery 1.3.2 和 1.7.1 的问题，所以看起来 1.8.11 有一个缺陷导致它与 1.3.2 不兼容（我'我假设它应该是自 .18 以来，我认为他们不会改变如此小的版本更改之间的兼容性）。

【讨论】：

【解决方案6】：

遇到同样的问题，最后修补了 jquery-ui.js

--- jquery-ui-1.8.23.js 2012-09-14 11:18:34.000000000 +-1000
+++ jquery-ui-1.8.23.js 2012-09-14 11:31:07.000000000 +-1000
@@ -9088,13 +9088,16 @@
                    .appendTo(uiButtonSet);
                // can't use .attr( props, true ) with jQuery 1.3.2.
                $.each( props, function( key, value ) {
                    if ( key === "click" ) {
                        return;
                    }
-                   if ( key in button ) {
+                   if ( key == "text" ) {
+                       button.html( value );
+                   }
+                   else if ( key in button ) {
                        button[ key ]( value );
                    } else {
                        button.attr( key, value );
                    }
                });
                if ($.fn.button) {

【讨论】：

【解决方案7】：

我遇到了同样的问题，但是没有文本的原因是我有依赖问题。简而言之，我在最终的 html 文件中包含了 2 个 jquery ui js。当我只留下 1 个版本的 jquery ui 时，一切似乎都按预期工作。

【讨论】：