将值传递给jquery对话框窗体

我需要一个对话框窗口弹出一个表单，并传递一个值给这个表单。我尝试了几种方法来解决这个问题，但我一直无法做到这一点。我找遍了，似乎什么也没找到

这是我的最新尝试：

  var message="variable";

 .click(function() {
 $( "#dialog-form" ).dialog( "open" );
 $('<input>').attr({
    type: 'text',
    id: 'hidden-input",
    value: message,
    name: 'bar'
 }).appendTo("#dialog-form");

var message=“variable”；
。单击（函数（）{
$（“#对话框窗体”）。对话框（“打开”）；
$（''）.attr({
键入：“文本”，
id:“隐藏输入”，
值：消息，
名称：“酒吧”
}).appendTo（“#对话框形式”）；

如果我在对话框中添加了append，弹出窗口将停止工作（我想我不知道如何正确执行此操作）

我想您正在寻找类似以下内容：

<script>
$(function(){
   var message = "variable";

   $("#showDialog").click(function() {
      $("#hidden-input").val(message);

      $("#dialogForm").dialog("open");
   });
});
</script>

<button id="showDialog">Show Dialog</button>

<div id="dialogForm">
<input type="text" id="hidden-input" name="bar"/>
</div>

$（函数（）{
var message=“变量”；
$（“#显示对话框”）。单击（函数（）{
$（“#隐藏输入”）.val（消息）；
$（#dialogForm”）.dialog（“打开”）；
});
});
显示对话框

我完全使用脚本来处理对话框（我认为它更干净）：

html:

默认名字：




创建表单

javascript:

function on_create_form_clicked()
{
    var html =
       "<div>" +
          "Firstname:<br>" +
          "<input type='text' class='firstname'/>" +
          "<br/><br/>" +
          "Lastname:<br>" +
          "<input type='text' class='lastname'/>" +
          "<br/><br/>" +
          "<button class='ok'>ok</button>" +    
       "</div>";

    var div = $(html);

    var default_firstname = $('#default_firstname').val();
    div.find('.firstname').val(default_firstname);        

    div.find('.ok').click(function()
    {
        div.dialog('close');

        var firstname = div.find('.firstname').val();
        var lastname = div.find('.lastname').val();

        alert("firstname was " + firstname
            + " and lastname was " + lastname);        
    });

    div.dialog(
    {
        title:"Enter firstname and lastname",
        close: destroy_this_dialog
    });
}

function destroy_this_dialog(event, ui)
{
  $(this).dialog("destroy");
  $(this).remove();
}

_create_form_clicked（）上的函数 { 变量html= "" + “名字：
”+ "" + “

”+ “姓氏：
”+ "" + “

”+ “好”+ ""; var div=$（html）； var default_firstname=$（'#default_firstname'）.val（）； div.find（'.firstname'）.val（默认名称）； div.find（'.ok'）。单击（函数（） { div.dialog（“关闭”）； var firstname=div.find（'.firstname'）.val（）； var lastname=div.find（'.lastname'）.val（）； 警报（“firstname was”+firstname +而lastname是“+lastname”； }); div.dialog( { 标题：“输入名字和姓氏”， 关闭：销毁此对话框 }); } 函数销毁此对话框（事件、用户界面） { $（此）.dialog（“销毁”）； $（this.remove（）； }

---

也可以是“隐藏输入”以单引号开始，以双引号结束。两种解决方案都非常有效。我实际上尝试过Calvin的方法，但我一定是做错了什么，因为它以前不起作用。我需要表单调用php脚本将数据输入数据库，因此我需要向表单传递ID。非常感谢！很好！不要忘记标记Calvins的回答是解决方案。更干净的解决方案，它在我使用的场景中工作。

function on_create_form_clicked()
{
    var html =
       "<div>" +
          "Firstname:<br>" +
          "<input type='text' class='firstname'/>" +
          "<br/><br/>" +
          "Lastname:<br>" +
          "<input type='text' class='lastname'/>" +
          "<br/><br/>" +
          "<button class='ok'>ok</button>" +    
       "</div>";

    var div = $(html);

    var default_firstname = $('#default_firstname').val();
    div.find('.firstname').val(default_firstname);        

    div.find('.ok').click(function()
    {
        div.dialog('close');

        var firstname = div.find('.firstname').val();
        var lastname = div.find('.lastname').val();

        alert("firstname was " + firstname
            + " and lastname was " + lastname);        
    });

    div.dialog(
    {
        title:"Enter firstname and lastname",
        close: destroy_this_dialog
    });
}

function destroy_this_dialog(event, ui)
{
  $(this).dialog("destroy");
  $(this).remove();
}