Question

所以我有这个我刚写的最初我做了2个单独的但是想要清理并且有一个方法：

$('#onestepcheckout .ty-billing-first-name input,#onestepcheckout .ty-billing-last-name input').blur(function() {
    var firstname = $(this).val();
    var lastname = $(this).val();
    $.ceAjax('request', fn_url('ac.email'), {
        method: 'post',
        data: {
            'firstname': firstname,
            'lastname': lastname
        },
        caching: true
    });
});

我对JS / jQuery很新，所以很少被卡住，因为你可以看到我为firstname和lastname设置了两次，当然我知道它不会工作......但无论如何为我需要的东西得到这个或者更确切地说在上面的行？

我是否正确地认为这可能有用......

var firstname_sel = '#onestepcheckout .ty-billing-first-name input';
var lastname_sel = '#onestepcheckout .ty-billing-last-name input';
$(firstname_sel,lastname_sel).blur(function() {
    var firstname = $(firstname_sel).val();
    var lastname = $(lastname_sel).val();
    $.ceAjax('request', fn_url('ac.email'), {
        method: 'post',
        data: {
            'firstname': firstname,
            'lastname': lastname
        },
        caching: true
    });
});

我没有测试但是想先检查一下？这是正确的做法

Answer 1

是的，那会有用。有些事情你可以改变，以使其更有效或友好。

首先，确保要在blur上执行该ajax调用（请记住，每次用户退出两个输入时都会调用它）。另一种方法是将您的输入包装在<form>中并绑定到该表单的submit事件，该事件将在用户点击<button type="submit" />时提交。

其次，您可能需要进行一些验证，因为当用户退出另一个输入时，一个字段可能为空：firstname = firstname === '' ? 'Default' : firstname;或类似的东西。

最后，有很多方法可以处理你的绑定/选择问题。你可以这样做：

<input id="first-name" class="name-input" ... />
<input id="last-name" class="name-input" ... />

$('.name-input').bind('blur', function() {
  var fName = $('#first-name').val();
  var lName = $('#last-name').val();

  ... validation code from above then ajax call ...
});

但有些人可能不会宽恕将功能与类相关联，因为新的开发人员很容易忽略这些代码或者意外复制和/或误认为样式类。

上面唯一可以改变的是通过向输入本身添加id而不是基于父元素进行选择来使选择器更简单。

Answer 2

好的设法解决了，这是解决方案

var firstname_sel = '#onestepcheckout .ty-billing-first-name input';
var lastname_sel = '#onestepcheckout .ty-billing-last-name input';
$(firstname_sel+','+lastname_sel).blur(function() {
    var firstname = $(firstname_sel).val();
    var lastname = $(lastname_sel).val();
    $.ceAjax('request', fn_url('ac.email'), {
        method: 'post',
        data: {
            'firstname': firstname,
            'lastname': lastname
        },
        caching: true
    });
});

jQuery 2个不同的选择器，但定义$（this）取决于哪一个

2 个答案: