0

我有一个通过 ajax 加载其内容的 jquery ui 对话框：

$('#register').click(function(e) {
    var tag = $('<div></div>');
    $.ajax({
        url: 'signup.html',
        success: function(data) {
            tag.html(data).dialog({modal: true}).dialog('open');
        }
    });
    e.preventDefault();
    return false;
});

我在内容中有第二个脚本应该在按下提交按钮时关闭对话框

$(function() {
    $('form #submit').click(function(e) {
        $(this).parents('.ui-dialog').dialog('close');
        e.preventDefault();
        return false;
    });
});

当我单击提交按钮时，我收到错误：

未捕获的错误：无法在初始化之前调用对话框上的方法；试图调用方法“关闭”

我缺少什么来允许我从通过 ajax 加载的内容中关闭对话框？

4

2 回答 2

1

您必须调用$('.ui-dialog') $('.ui-dialog ...')`dialog('close')所在的元素。dialog('open') was called before. You're calling the function oninstead of

您应该在代码中为标记元素定义 id 或类：

var tag = $('<div id="signup-id"></div>');

然后在点击处理程序中找到正确的元素，如下所示：

$(this).parents('.ui-dialog').children('#signup-id').dialog('close');

注意：您可以#signup-id直接在点击处理程序中找到，就像$(this).children('#signup-id')您确定从不包含带有idsignup.html的元素一样。signup-id

于 2013-10-09T13:03:34.920 回答
0

在 html 中定义你的标签对话框

<div id="tag_dialog" style="display:none">
</div>

然后准备好文件：

$(document).ready(function(){
    $('#tag_dialog').dialog({
        modal:true,
        autoOpen:false,
        //you could give some other options such as width, height .....
    });
    $('#register').click(function(e) {
       $.ajax({
           url: 'signup.html',
           success: function(data) {
               $('#tag_dialog').html(data).dialog('open');
           }
       });
       e.preventDefault();
       return false;
   });
    $('form #submit').click(function(e) {
        $('#tag_dialog').dialog('close');
        e.preventDefault();
        return false;
    });
});
于 2013-10-09T12:32:27.090 回答