在警报中显示输入文本字段 - jquery ui答案

【问题标题】：Displaying input text field in alert - jquery ui在警报中显示输入文本字段 - jquery ui
【发布时间】：2015-04-26 14:27:17
【问题描述】：

我正在使用 jquery ui 警报对话框。我修改了对话框，使其具有一个输入字段以允许输入文本。按照手册，我将输入放在div id="dialog-form" 中。当用户单击按钮并显示警报时，我只想查看输入字段。问题是它显示在初始起始页面加载：如何仅在按钮单击事件上显示输入字段？ JSFIDDLE

jQuery

$('button').click(
        function() {
            console.log($(this));
            var divElem = $(this);
            dialog = $( "#dialog-form" ).dialog({
                height: 300,
                width: 350,
                modal: true,
                buttons: {
                    "Save": function() {
                        divElem.find('.text').text($( "#dialog-form input" ).val());
                        dialog.dialog( "close" );
                    },
                    Cancel: function() {
                        dialog.dialog( "close" );
                    }
                }
            });

        }
    );

HTML

<button>Click Me!</button>

<div id="dialog-form">
    <label>Text:</label><input type="text" />
</div>

【问题讨论】：

标签： jquery jquery-ui

【解决方案1】：

试试这个。

#dialog-form {
    display:none;
}

演示：

http://jsfiddle.net/7buayqa0/

【讨论】：

【解决方案2】：

在css的第一行使用这段代码

#dialog-form {
    display:none;
}

加载页面不显示

【讨论】：