Ajax Jquery 函数参数答案

【问题标题】：Ajax Jquery function paramsAjax Jquery 函数参数
【发布时间】：2013-11-10 18:56:53
【问题描述】：

我有这个工作的代码，但我想更通用。

此代码使用 Ajax 提交表单，并获取此 json：

{"message": "Verifique todos los campos","success": "false"}

取决于成功或不向我的#MESSAGE-DIV 添加一个类，所以我想传递给函数

#MESSAGE-DIV，而不是被硬编码

var frm = $('#loginForm');
frm.submit(function () {
    $.ajax({
        dataType: "json",
        type: frm.attr('method'),
        url: frm.attr('action'),
        data: frm.serialize(),
        success: function (data) {                                            
            if(data['success'] == "true") {
                alerta = "alert alert-success";
                $("#MESSAGE-DIV" ).removeClass( "alert alert-error" )
                $("#MESSAGE-DIV" ).html(data['message']).addClass(alerta);
                window.setTimeout(function() {
                    window.location.href = '/stockrecetas/';
                }, 3000);
            } 
            else {
                alerta = "alert alert-error";
                $("#MESSAGE-DIV" ).removeClass( "alert alert-success" )
                $("#MESSAGE-DIV" ).html(data['message']).addClass(alerta);
            }    

        },
        error: function(data) {                    

        }
    });
    return false;
});

这是我的 HTML 表单：

<form id="loginForm" method="POST" action="login"><input type="hidden" name="csrfmiddlewaretoken" value="2EDW4oyrAPToDObfiaXQO95oFOGM9H5B">              
    <div id="MESSAGE-DIV"></div>
    <label for="id_username">Username:</label><input id="id_username" maxlength="30" name="username" type="text">
    <label for="id_password">Password:</label><input id="id_password" name="password" type="password">                          
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary" type="submit" value="Login">Log In</button>
</form>

【问题讨论】：

想详细说明一下？我很难理解你的问题。另外，你已经尝试过什么了吗？你在哪里遇到了问题？还是您在询问一般建议？
我有两种形式，一种用于注册，一种用于登录。我想显示错误消息或成功。并且不想重写所有代码，只是更改我用来显示消息的 DIV 的名称。并且不想重写所有代码，更改我用来显示消息的 DIV 的名称。

标签： javascript jquery ajax forms

【解决方案1】：

制作一个不错的函数，接受作为参数传递的选择器：

function submit(formEl, messageEl) {
    $(formEl).submit(function() {
        // ...
        $(messageEl).removeClass("alert alert-success");
        // ...
    });
});

（formEl 只是为了进一步概括这一点）

【讨论】：

我应该如何调用这个函数？

【解决方案2】：

就像 James Lai 说的那样，我做了一个函数，女巫接收参数并发送到 de .ajax()

解决方案：

function genericForm (form, messagediv) {
    var frm = form;
    frm.submit( function () {

        $.ajax({
            dataType: "json",
            type: frm.attr('method'),
            url: frm.attr('action'),
            data: frm.serialize(),
            success: function (data) {                                            
                if(data['success'] == "true") {
                    alerta = "alert alert-success";
                    $(messagediv).removeClass( "alert alert-error" )
                    $(messagediv).html(data['message']).addClass(alerta);
                    window.setTimeout(function() {
                    window.location.href = '/stockrecetas/';
                    }, 3000);
                } 
                else {
                    alerta = "alert alert-error";
                    $(messagediv).removeClass( "alert alert-success" )
                    $(messagediv).html(data['message']).addClass(alerta);
                }    
            },
            error: function(data) {                    
            }
        });
        return false;


    });


   };

所以我这样调用函数：

    var frm1 = $('#registerForm');
    frm1.submit(genericForm(frm1, "#MESSAGE-DIV1"));

【讨论】：