1

首先我想说我根本不是 javascript 专家..

我正在测试Ray StoneleanModal 插件。我可以使用插件打开和关闭模式。

我在模态 div 中添加了一个表单。我现在要做的是在用户单击提交按钮时关闭模式(如您在项目网站中所见)。

问题是我没有像往常一样处理表格。我使用 jQuery 获取数据,并使用$.ajax(). 这是我的代码:

 $(function() {
     $('#add-user').submit(function() {
         $.ajax({
             type: 'post',
             url: '***',
             data: '***',
             contentType: 'application/json',
             dataType: 'json'
         });
         $(this).closest('form').find("input[type=text], textarea").val("");
         $(this).leanModal.closeModal('#cp');
         return false;
     }); 
});

#add-user打开模式的链接 在哪里 。#cp是模态的 div id。

在这种情况下,div 靠近,但 div 后面的模糊在用户点击之前不会消失。效果和使用$('#cp').remove(); How can I fully close the div when the request is sent时效果一样?提前致谢

更新:我的代码的 jsFiddle在这里可用。一些 CSS 规则被遗漏了,我没有展示 AJAX 请求,但我认为主要代码就在那里。

4

1 回答 1

0

首先$.ajax()是异步的,所以以下几行

$(this).closest('form').find("input[type=text], textarea").val("");
$(this).leanModal.closeModal('#cp');

即使您的查询不成功,也会执行。
你最好做

$.ajax({
    ...
    success: function () {
        $(this).closest('form').find("input[type=text], textarea").val("");
        $(this).leanModal.closeModal('#cp');
    }
});

其次,在检查了来源之后,我认为你应该使用

$.leanModal.close_modal('#cp');

$("#lean_overlay")似乎是您想要摆脱的“模糊”元素。
最终你可以做到$("#lean_overlay").remove(),但插件似乎已经管理它

最后你应该有

$(function() {
    $('#add-user').submit(function(e) {
        e.preventDefault();
        $.ajax({
            type: 'post',
            url: '***',
            data: '***',
            contentType: 'application/json',
            dataType: 'json',
            success: function () {
                $('#add-user :input:not(:submit)').val('');
                $.leanModal.close_modal('#add-user');
            }
        });
        return false;
    }); 
});
于 2013-04-17T11:11:36.990 回答