jQueryUI对话框-按钮文本未显示

Question

我遇到了一个奇怪的错误，与对话框有关。虽然我可以正常加载对话框，但是每当我分配一个按钮时，尽管它会显示出来，但按钮的名称不会显示出来。这是成功启动对话框的代码...

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类应该包含文本，但是显然它没有。有什么想法？

- Vin

---

你能提供一个 jsFiddle 吗？我无法重现你的问题。 - Exelian

你确定对话框的高度或宽度足够吗？ - DavideDM

无论宽度/高度设置如何，它仍然显示为空白。似乎在过程中丢失了按钮的名称。 - Vin

Answer 1

这启发了我很多，但实际上并不完全适用于我。我做了以下修改。我认为这样效果更好。

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

- conceptacid

Answer 2

使用jQuery UI v1.8.22的CDN，我可以成功运行此代码（已测试）：

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

- Martin Zeitler

---

可能只是一个临时修复，直到在UI库中得到修复。 - Martin Zeitler

Answer 3

抱歉，我是 Stack Overflow 的新手。

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

var button1_text = '';

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

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

- Vin

Answer 4

我遇到了同样的问题，最终修补了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) {

- Lodle

Answer 5

我认为有些东西丢失了。看到它工作会很好。我尝试创建一个测试，但是没有文本，而且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> 

- Jared

---

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

Answer 6

我曾经遇到过同样的问题，但原因是存在依赖关系问题。简而言之，我在最终的 HTML 文件中包含了两个 jQuery UI JS 文件。当我只保留其中一个版本的 jQuery UI 时，一切都能按照预期正常工作。

- Igoris Azanovas

Answer 7

我曾经遇到过类似的问题。最终通过将使用的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是兼容的，我认为他们不会在如此小的版本更改之间改变兼容性）。

- Rich