函数在页面加载时发送ajax请求

问题描述：

我有下面的代码在页面加载运行。我只想在用户完成在文本框中写入时运行它。函数在页面加载时发送ajax请求

代码是：

$(document).ready(function() { 
     $("#user_email").on('change keyup paste', function() { 
      $.post('/users/check_email?email=' + $("#user_email").val(), function (data) { 
       console.log(data); 
      }); 
     }); 
    });

文本字段：

<%= f.email_field :email, :type=>"email" %>

我不想在页面加载，但是当用户键入的东西在里面，那么它应该做的工作，阿贾克斯运行它。

此外，如果用户写1或3个字符，它开始发送ajax。我需要检查电子邮件，以便如何处理此用例？

更新

重要的问题是我在文本框救了我的电子邮件，类似的形式自动填写信息，这样当页面加载时，它发送Ajax请求，并开始显示XYZ电子邮件已经存在于系统中。我不想在第一次加载页面时发送ajax请求，但我想在有人编写并完成写入电子邮件时使其工作。

我已更新我的问题，并感谢您的更正;） – LearningROR

没有想过自动填充，blech。 :-) –

@LearningROR：编辑表示字面上没有什么比这个问题更相关。该代码应该已经按照预期工作，除非在加载DOM后以某种方式填充输入之后还有别的东西。您可以在“change”事件的回调中添加严格的检查，但真正的电子邮件检查应该发生在服务器端而不是客户端（最终两者）。您可能要遵循的过程是：1）编写（或更好地搜索）电子邮件正则表达式。 2）获取user_email值并检查长度是否大于3. 3）两次检查后都要执行ajax调用。 – briosheje

答

检查输入的值的长度，检查它是否是> 3，只比发送一个AJAX请求：

$(document).ready(function() { 
 
    $("#user_email").on('keyup change', function() { 
 
    var enteredValue = $(this).val(); 
 
    if (enteredValue.length > 3) { 
 
     $.post('/users/check_email?email=' + enteredValue, function(response) { 
 
     console.log(response); 
 
     }); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id='user_email' type='text' />

引用的代码不会执行OP所说的内容，也不会切换到“focusout”做OP所说的他/她想要的内容 –

这个问题说_用户完成writing_时，是不是'focusout'？ –

它可能不是，它可能只是当他们停止输入。（他们描述的问题，我们真的无法帮助他们）（请注意，当用户离开现场时'change'将被触发，不需要'focusout'，即使没有任何变化也会触发。） –

答

试试这个代码：

$(document).ready(function() { 
    $("#user_email").on('change keyup paste', function() { 
     $.post('/users/check_email', { email: $("#user_email").val()}, 
      function(data){ 
       console.log(data); 
     }).fail(function(){ 
       console.log("error"); 
     }); 
    }); 
});

为什么？你改变了什么？你为什么改变它？代码转储不是有用的*答案。另外请注意，OP对回调的使用非常好。 –

我添加了更多的细节问题。谢谢 – LearningROR

函数在页面加载时发送ajax请求

相关推荐