JQuery自动完成验证选定的值

发布时间:2020-01-12 发布网站:脚本之家
脚本之家收集整理的这篇文章主要介绍了JQuery自动完成验证选定的值脚本之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我们正在使用由 Jörn Zaefferer编写的自动完成jQuery插件,并尝试验证输入的有效选项。

插件会在result()事件触发时进行选择。这是可以的,但是当用户也点击时,我需要检查文本框中的值。所以我们尝试了一个.change()和.blur()事件,但是它们都是一个问题:当你点击结果div(“建议”列表)中的一个条目。.change()和.blur()事件触发,这是插件之前已经写了一个值到文本框,所以没有什么可以验证在这一点上。

有人可以帮助我配置事件,以便每当有人点击,而不是在结果框中,我可以检查框中的有效值。如果这是错误的方法,请通知我正确的。我们最初使用这个插件,因为它的“mustMatch”选项。在所有情况下,此选项似乎都不起作用。很多时候,一个有效的条目将被写入文本框,而不是由插件清除为无效,我无法确定为什么。

基本代码示例:

<html>
<head>
<title>Choose Favorite</title>
<script language="JavaScript" src="jquery-1.3.2.min.js" ></script>
<script language="JavaScript" src="jquery.autocomplete.min.js" ></script>
<script>
    $(".suggest").autocomplete("fetchNames.asp",{
        matchContains:false,minChars:1,autoFill:false,mustMatch:false,cacheLength:20,max:20
    });

    $(".suggest").result(function(event,data,formatted) {
        var u = this;
        // Check value here

    });

    /* OR */

    $(".suggest").change(function(me) {
        //check value here
    });

</script>
</head>
<body>
    <label for="tbxName">Select name (I show 10):</label><br />
    <INPUT type="text" id="tbxName" name="tbxName" class="suggest"><br />
</body>
</html>

解决方法

我想,而不是编写自己的函数来验证数据是否匹配,你可以调用search()。如果使用空数据参数调用result(),那么您知道自动完成未被使用,并且通过在blur上调用search(),您可以保证至少要求一次result()。

我已经发布了这个代码为a similar question,这可能也有帮助。

autocompleteField.result(function(event,formatted) {
    if (data) {
        //auto-complete matched
        //NB: this might get called twice,but that's okay
    }
    else {
        //must have been triggered by search() below
        //there was no match
    }
});

autocompleteField.blur(function(){
    autocompleteField.search(); //trigger result() on blur,even if autocomplete wasn't used
});

总结

以上是脚本之家为你收集整理的JQuery自动完成验证选定的值全部内容,希望文章能够帮你解决JQuery自动完成验证选定的值所遇到的程序开发问题。

如果觉得脚本之家网站内容还不错,欢迎将脚本之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您喜欢交流学习经验,点击链接加入脚本之家官方QQ群:1065694478
脚本之家官方公众号

微信公众号搜索 “ 程序精选 ” ,选择关注!

微信公众号搜索 “ 程序精选 ”
精选程序员所需精品干货内容!