jquery - 如何在销毁后重置对话框中的文本框值？

Question

我有一个对话框，其中有 2 个文本框。我想在对话框被销毁后重置文本框值。我怎样才能做到这一点？

如果我在文本框中输入了值并单击“取消”，重新打开对话框将显示之前输入的数据。

function setDialogWindows($element) {
      $('#change').dialog({    
           autoOpen: true,    
           width: 380,    
           buttons: {   
              "Cancel": function() {    
                   $(this).dialog('destroy');   
              },    
              "Accept": function() {    
              } 
     }): 
 }

<小时/>

$('#link').click(function() {    
    setDialogWindows('#change');    
});

<小时/>

<div id="change" title="Change password" >
    <input type="hidden" id="User_Name" name="Name"/>    
    <input type="textbox" id="text1" />
    <input type="textbox" id="text2" />
</div>

Answer 1

首先，类型textbox不存在。请改用 text 或 password(对于屏蔽字符)。

使用此代码来清理输入:

"Accept": function() {    
    $("#text1").val('');
    $("#text2").val('');
}

<小时/>

最后，我重写了代码:

HTML:

<a href="javascript:void(0);" id="link">Show me a dialog!</a>
<div id="change" title="Change password">
    <input type="hidden" id="User_Name" name="Name"/>    
    <input type="text" id="text1"/>
    <input type="text" id="text2"/>
</div>

JavaScript:

$('#link').click(function() {    
    setDialogWindows();    
});

function setDialogWindows() {
    $('#change').dialog({
        autoOpen: true,
        width: 380,    
        buttons: {   
            "Cancel": function() {    
                $(this).dialog('close');
            },    
            "Accept": function() {
                /* Place your handler here. */
                $(this).dialog('close');
            }
        },
        close: function() {
                $("#text1").val('');
                $("#text2").val('');
        }
   });
}

您可以将 $(this).dialog('destroy'); 与 "Cancel" 按钮一起使用，但它不会修改您的输入 code> 字段，因为它们是独立于对话框声明的。这就是为什么您应该手动清理它们。