1

こんにちは私はオートコンプリートリストの作成に以下のコードを使用しています。

    $('#input').autocomplete({ ajax_get : get_roles});

    function get_roles(v,cont,roleName){
            var roleName = roleName.value;
            roleName = roleName.toLowerCase();
            $.get('/da/roleautocomplete?roleName='+escape(roleName),{q:v},
                function(obj){
                  var res = [];
                  for(var i=0;i<obj.length;i++){
                    res.push({ id:i , value:obj[i]});
                  }
                  cont(res);
                },
                'json')
        }

オートコンプリートリストからアイテムをクリックまたは選択したときにイベントを発生させたい。私はこれを試しました-

$('#input').autocomplete({
     select:function(event, ui){
          // do your things here
      }, etc.

しかし、役に立たない。誰かがこれで私を助けてくれますか?

4

2 に答える 2

2

デモ: http: //jsfiddle.net/DMDHC/

役立つ読み物: http: //jqueryui.com/demos/autocomplete/(利用可能なオプションやイベントなどについて読むことができます)

コード:

$( "#search" ).autocomplete({
    source: function( req, resp ) {
        $.post( "/echo/json/", {
            json: '["Rambo", "Foobar", "This", "That", "Batman", "Hulk"]',
            delay: 1
        }, function(data) {
            resp( data );
        }, "JSON" );
    },
    select: function(event, ui) {
        var TABKEY = 9;
        this.value = ui.item.value;

        if (event.keyCode == TABKEY) { 
            event.preventDefault();
            this.value = this.value + " ";
            $('#search').focus();
        }

        return false;
    }
});
于 2012-05-03T12:39:28.330 に答える
2

最初に使用しようとしたときに同様の問題が発生しましたselect:function(event,ui){ ... }が、それは間違いなく進むべき道です。

ui.item重要なのは、クリックまたは選択されたオプションを取得するために使用することです。私はもともとその時使っていましたが、eventクリックthisとキー選択で違います(console.logいくつかの観点から見てください)ので、ui.itemあなたが望むものです。オートコンプリートが設定されるlabel: ..., value: ...ので、おそらく使用するのはui.item.labelui.item.valueです。

于 2012-05-03T12:49:01.823 に答える