Question

我正在创建酒店预订系统，需要大量的模态对话框。为此我使用jqueryUI对话框小部件。昨天我将它嵌入到应用程序的一个功能中，但这次当对话框打开时单击，然后它的Header非常大，高度约为300-400px，而正常的标题高度约为40px。在应用程序的任何地方，它仍然可以正常工作，但只有在它给出这样的错误的地方。 Css在所有地方也是相同的。如果有人知道如何解决这个问题，那么请在这里发帖。

Error can view at this link of an image

下面列出了javascript代码，单击按钮时会触发该代码。

$("#dialogaddSeasons").dialog({
            resizable: false,  
            modal:true,
            width: 460, 
            maxWidth:500,
            height:400,
            draggable: false ,
            title:"Add New Season",
            buttons: { 
                'Add Season': function() {              
                    $("#dialogaddSeasons #addSeasonForm").submit();
                },
                Cancel: function() {
                    $(this).dialog('close');   
                }   
            }
        });

它的html放在body标签的开头，带有其他对话框小部件，如下所示。

<div id="dialogaddSeasons" >
    <div id="containerManangeRooms"> 
        <form action="../booking_system/season.php" enctype="multipart/form-data" method="post" id="addSeasonForm" >
            <table>
            <tr><td><label>Season Name: </label></td> <td><input type="text"  name="season_name" id="season_name" class="required elementsAddEdit  ui-widget-content ui-corner-all text" /></td></tr>
            <tr><td><label>Starting Date: </label></td> <td><input type="text"  name="start_date" id="start_date"  class="date required elementsAddEdit  ui-widget-content ui-corner-all text" /></td></tr>
            <tr><td><label>Ending Date: </label></td> <td> <input type="text" name="end_date" id="end_date"  class="date required elementsAddEdit  ui-widget-content ui-corner-all text"  /></td></tr>
            </table>    
        </form>
    </div>
</div>

由于 Ayaz Alavi

Answer 1

我使用jquery-ui主题遇到了同样的问题。主题的版本与jquery-ui的版本不匹配。一旦我同步它们就解决了我的问题。

Answer 2

无法使用Firebug右键单击并检查标题元素上的元素（提示），我会说有一些其他CSS覆盖或添加到您想要的样式。除非您可以发布指向页面的链接或其完整示例（因为该片段不包含任何可能影响它的CSS），您需要自己尝试上述操作并删除或覆盖相应的属性。

jqueryUI对话框标题大小

3 个答案: