现场完成的AJAX发布?

时间:2014-04-06 12:51:59

标签: jquery ajax validation

我有以下代码验证名为lms_domain的表单字段。它只是使用对执行MySQLi计数查询的另一个文件的AJAX调用来检查用户选择的子域是否可用。该代码目前适用于提交表单,但我希望它在用户键入字段或已完成字段时执行AJAX帖子。你是如何使用JQuery实现这一目标的?

$('#lms_name').keyup(function(){

    /* some code here */

    $.ajax({
        type: 'POST',
        url: 'assets/lmsdomaincheck.php',
        data: "lmsdomain="+value+".thedomain.com",
        async: false,
        success: function(htmldata){

            if (htmldata=="success") {
                $('#spanlmsdomain').html('GOOD');
            }else {
                msg+="<b>Error on LMS domain name : </b>"+value+".thedomain.com not available.<br/>";
                $('#spanlmsdomain').html('BAD');
            }
        }
    });

    /* some code here */

});

提前感谢任何提示!

3 个答案:

答案 0 :(得分:1)

$('#lms_name').on('blur', function() {

一旦光标离开字段,这将执行,表示用户输入已完成。

var busy = false;
$('#lms_name').on('blur keyup keypress', function(e) {
    if ((e.type == 'keyup' || e.type == 'keypress') && busy === false) {
        busy = true;
        var avail = setTimeout(function() {
            $.ajax({ ...yourAJAXhere... });
            busy = false;  // Put this line in the success() / error() callbacks
        }, 500);
    } else if (busy === false) {
        clearTimeout(avail);
        busy = true;
        $.ajax({ ...yourAJAXhere... });
        busy = false;  // Put this line in the success() / error() callbacks
    } else {
        return;
    }
});

这会将第一个与超时等待.5秒组合,然后检查服务器的可用性。它确保一次只能进行一次检查,但是快速模拟,因此您需要根据自己的情况进行微调。

答案 1 :(得分:0)

嗯,你已经在使用这个功能,我在这里添加的内容将是一些字符数。如

if(document.getElementById("lms_name").length > 5) {
   /* execute the ajax here */
}

因为大多数用户想要5到8个字母的用户名。因此,当用户向textarea或输入添加5个字母时,这足以检查用户名。

答案 2 :(得分:0)

$('#lms_name').blur(function(){

    if ($(this).data('tOut')) {
        clearTimeout($(this).data('tOut'));
    }

    var newTOut = setTimeout(function () {
        // ajax call here
    }, 10000);

    $(this).data('tOut', newTOut);
});

在最后一次更改字段后出现大量延迟时触发超时&amp;焦点转移到了现场。