Question

当我聚焦输入框的id为“regUsername”时，会执行一个名为“checkUsername”的函数

$('#regUsername').focusout(function(){
    checkUsername();
});

功能：

function checkUsername(){
    var form_data = { username : $('#regUsername').val() };
    $.ajax({
        url: "/register/validateUsername",
        type: 'POST',
        data: form_data,
        success: function(msg) {
            var obj = $.parseJSON(msg);
        },
        error: function(data){
            dbdown();
        }
    });
}

目前，每次聚焦输入框时，都会运行ajax post函数。这会导致返回的验证框略有闪烁。我想知道是否可以保留传入的值的最后一个实例，然后将其与传入的新值进行比较。如果它们相同则不需要ajax帖子。

对此的任何帮助将非常感激：）

Answer 1

您可以使用HiddenField。您确定要POST代替GET吗？

Answer 2

存储它，如果不同的调用ajax并设置新的'lastValue'

var lastValue = "";
function checkUsername(){
    var curr = $('#regUsername').val(),
        form_data = { username : curr };
    if (lastValue !== curr) {
      $.ajax({
        url: "/register/validateUsername",
        type: 'POST',
        data: form_data,
        success: function(msg) {
            var obj = $.parseJSON(msg);
        },
        error: function(data){
            dbdown();
        }
     });
     lastValue = curr;
   }
}

Answer 3

$('#regUsername').focusout(function(){
  var previousData = $(this).data("previousData");
  if(previousData && (!previousData.wasValid || previousData.user != $(this).val())){
    checkUsername();    
  }

});

function checkUsername(){
    var regUserName = $('#regUsername');
    var form_data = { username : regUserName.val() };
    $.ajax({
        url: "/register/validateUsername",
        type: 'POST',
        data: form_data,
        success: function(msg) {
            var obj = $.parseJSON(msg);


         var isvalid = false;
// put in your 'is valid' logic here
         if(obj){
               isvalid = true;
         }

            regUserName.data("previousData", {wasValid:isvalid , user: form_data.username});
        },
        error: function(data){
            dbdown();
        }
    });
}

Answer 4

在类似的情况下，我做了以下事情：

在准备就绪的功能中，我包括：

 $(":input").each(function(){$(this).data('oldVal',$(this).val());});

并定义了如下函数：

function valueChanged(field) {
    var oldVal=$("#"+field).data("oldVal");
    var newVal=$("#"+field).val();

    if (oldVal != newVal) return true;
    else return false;
}

这提供了一个可用于任何输入的功能。只需在你的ajax调用周围添加以下内容：

if  (valueChanged("regUsername")) {
    /* ajax call... */
}

编辑：如果是的话，增加了关闭。另请注意，您的ajax回调需要更新oldVal，以便您查看字段中的最后一个值，而不是加载页面时的值。

jQuery存储最后一个输入值并与new进行比较

4 个答案: