创建一个jQuery函数,以便我可以在不同的事件/场景中调用它

时间:2016-02-04 22:34:09

标签: jquery ajax

所以我有以下功能,效果很好,它会模糊,一旦验证将激活ajax来存储它但我想我还需要添加,所以当页面加载和电子邮件已填入电子邮件输入它看到并执行与某些人自动填充此数据相同的操作,因此,如果情况可能永远不会改变那么模糊,其保存电子邮件的ajax将无法正常工作。

到目前为止,我已经复制了它,但是不认为它的工作正常...理想情况下做一个新函数会很好,所以在这些事件中调用......但不确定JS对我来说是新鲜的但是我觉得到目前为止我做得还不错。

所以它的作用是在结帐时输入电子邮件并退出电子邮件输入,它将验证,如果有效,则添加到废弃的购物车信息,以防他们没有完成订单,我们可以跟进被遗弃的购物车,但如果你知道我的意思,可能会错过一些人的信息,这些人的详细信息是由他们的浏览器填充的?

if($('#onestepcheckout .ty-billing-email input').val()){
    var email = $(this).val();  
    var emailError = "<p>The email address in the <b>E-mail</b> field is invalid.</p>";
    var emailInputId = $(this).attr('id');
    if ($("." + emailInputId + "_error_message").length>0) {
        $("." + emailInputId + "_error_message").remove();
    }
    //console.log($(emailInputId+"_error_message"));
    if (validEmail(email)) {
        //alert('valid email');
        $.ceAjax('request', fn_url('ac.email' ), {
            method: 'post',
            data: {
                'email': email
            },
            caching: true
        });
        $(this).removeClass('cm-failed-field'); 
        $(this).prev().removeClass('cm-failed-label');
        $(this).next("span").remove();
    } else {
        $(this).addClass('cm-failed-field');
        $(this).prev().addClass('cm-failed-label');
        $(this).after("<span class='" + emailInputId + "_error_message help-inline' ><p>" + emailError + "</p></span>");
    }
}

$('#onestepcheckout .ty-billing-email input').blur(function() {

    var email = $(this).val();  
    var emailError = "<p>The email address in the <b>E-mail</b> field is invalid.</p>";
    var emailInputId = $(this).attr('id');
    if ($("." + emailInputId + "_error_message").length>0) {
        $("." + emailInputId + "_error_message").remove();
    }
    //console.log($(emailInputId+"_error_message"));
    if (validEmail(email)) {
        //alert('valid email');
        $.ceAjax('request', fn_url('ac.email' ), {
            method: 'post',
            data: {
                'email': email
            },
            caching: true
        });
        $(this).removeClass('cm-failed-field'); 
        $(this).prev().removeClass('cm-failed-label');
        $(this).next("span").remove();
    } else {
        $(this).addClass('cm-failed-field');
        $(this).prev().addClass('cm-failed-label');
        $(this).after("<span class='" + emailInputId + "_error_message help-inline' ><p>" + emailError + "</p></span>");
    }

});

1 个答案:

答案 0 :(得分:1)

未经测试,但是像这样:

function checkIt(field) {
    field = $(field);
    var email = field.val();
    var emailError = "<p>The email address in the <b>E-mail</b> field is invalid.</p>";
    var emailInputId = field.attr('id');
    if ($("." + emailInputId + "_error_message").length > 0) {
        $("." + emailInputId + "_error_message").remove();
    }
    //console.log($(emailInputId+"_error_message"));
    if (validEmail(email)) {
        //alert('valid email');
        $.ceAjax('request', fn_url('ac.email'), {
            method: 'post',
            data: {
                'email': email
            },
            caching: true
        });
        field.removeClass('cm-failed-field');
        field.prev().removeClass('cm-failed-label');
        field.next("span").remove();
    } else {
        field.addClass('cm-failed-field');
        field.prev().addClass('cm-failed-label');
        field.after("<span class='" + emailInputId + "_error_message help-inline' ><p>" + emailError + "</p></span>");
    }
}

var field = $('#onestepcheckout .ty-billing-email input')[0];
if (field.value) {
    checkIt(field);
}

$('#onestepcheckout .ty-billing-email input').blur(function() {
    checkIt(this);
});