0

私は次のjqueryオートコンプリートボックスを使用しており、正常に動作しています

JQuery オートコンプリート

しかし、問題は、ユーザーがテキスト ボックスに入力した値が私の dtasource リストに存在するかどうかを知りたいことです。

オートコンプリートに提供した私のデータソースは

var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
    ];

ユーザーが入力して送信ボタンを押すと、リストに存在するXYZかどうかをどのように知ることができますか。XYZ

私を助けることができるいくつかのコールバック関数はありますか

...私を助けてください、事前に感謝します

4

2 に答える 2

2

動作中の jsFiddle はここにあります 

$(function() {
    $('#element').on('keyup', function(){
        var _self = $(this);
        var val = _self.val();
        var patt = new RegExp(val, 'g');
        $.each(availableTags, function(i,obj){
            if(patt.test(obj) == true){
                if(_self.parent().find('.inArray').length){
                    $('.inArray').removeClass('isNot').text('The value is in the array');
                }else{
                    _self.after('<div class="inArray isIn"> The value is in the array.</div>');
                }
                //exit loop, matches are here.
                return false;
            }else{
                if(_self.parent().find('.inArray').length){
                    $('.inArray').removeClass('isIn').text('The value is NOT in the array');
                }else{
                    _self.after('<div class="inArray isNot"> The value is NOT in the array.</div>');

                }

            }
        });
    });
});

バリデーター要素用の小さな CSS。

.inArray{
    position:absolute;
    top:0;
    left:260px;
    margin-left:10px;    
  }

  .inArray.isIn{
     color:green;   
  }

  .inArray.isNot{
      color:red;   
  }

（cssは必要ありません。将来の読者のためにここにあるだけです）

配列を反復処理し、テストする正規表現オブジェクトを定義し、条件を作成します。true の場合は、 を保持する要素がvalidation text存在するかどうかを確認します。存在する場合は、新しい要素を作成せず、div 内のテキストを置き換えます。ステートメントが反復子内で少なくとも 1 回 true の場合、関数を終了します。つまり、この関数を拡張して、 を削除せずにマッチの数を確認したり、マッチを数えたりすることはできませreturn false;んincrementing a variable。

動作中の jsFiddle はここにあります

于 2012-09-28T06:43:52.640 に答える
1

オートコンプリートは入力の検証を実行しません。http://docs.jquery.com/Plugins/Validationから jquery-validate プラグインを使用できます。次に、値が availableTags 配列にあるかどうかをチェックするカスタム検証メソッドを作成できます。

私のフィドルはここにあります。

$(function() {
    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
        ];
    $("#tag").autocomplete({
        source: availableTags
    });
    $.validator.addMethod("validTag", function(value) {
        return $.inArray(value, availableTags) >= 0;
    });
    $("#myform").validate({
        rules: {
            tag: {
                validTag: true
            }
        },
        messages: {
            tag: "Please enter a valid tag"
        }
    });
});​
于 2012-09-28T06:12:50.087 に答える