4

次のデモでは、「Alaska」値を挿入した後、オートコンプリートで Alaska 値が再度表示されないようにソースが更新されます。

var newSource = this.source
                    .slice(0,pos)
                    .concat(this.source.slice(pos+1));
this.source = newSource;

とにかく、テキストエリアから Alaska を削除すると、値Alaskaがソースに再び表示されるはずです。
ユーザーがテキストエリアからデータを削除した場合、ソースデータを復元する方法のヒントはありますか?

私の考えは、オプション `source オプションにアクセスすることです

$('.typeahead').on('change', function () { })

ヒントはありますか?

PS:
jquery とアンダースコアを使用しています

4

3 に答える 3

2

matcherすでに選択されている状態をテストするには、おそらく関数を変更する必要があります。

var tabPresentStates = this.query.split(','),
    nbPresentStates = tabPresentStates.length;
for(var iState = 0; iState < nbPresentStates; iState++) {
   if(item === tabPresentStates[iState].trim())
       return false;
}

このフィドルを参照してください。

于 2012-11-26T15:55:25.767 に答える
1

ソースを変更する代わりに、ソーターを使用して、既に選択した値を除外できます。

http://jsfiddle.net/BwDmM/71/

PS私はおそらくあなたのコードをJasnyの拡張Bootstrap http://jasny.github.com/bootstrapの次のバージョンに含めるでしょう:)

!function(source) {
    function extractor(query) {
        var result = /([^,]+)$/.exec(query);
        if(result && result[1])
            return result[1].trim();
        return '';
    }

    $('.typeahead').typeahead({
        source: source,
        updater: function(item) {
            return this.$element.val().replace(/[^,]*$/,'')+item+',';
        },
        matcher: function (item) {
          var tquery = extractor(this.query);
          if(!tquery) return false;
          return ~item.toLowerCase().indexOf(tquery)
        },
        highlighter: function (item) {

          var query = extractor(this.query).replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, '\\$&')
          return item.replace(new RegExp('(' + query + ')', 'ig'), function ($1, match) {
            return '<strong>' + match + '</strong>'
          })
        },
        sorter: function(items) {
          var beginswith = []
            , caseSensitive = []
            , caseInsensitive = []
            , existing = $.each(this.$element.val().split(','), function(i, val) { return val.trim() })
            , item

          while (item = items.shift()) {
            if ($.inArray(item, existing) >= 0) continue;

            if (!item.toLowerCase().indexOf(this.query.toLowerCase())) beginswith.push(item)
            else if (~item.indexOf(this.query)) caseSensitive.push(item)
            else caseInsensitive.push(item)
          }

          return beginswith.concat(caseSensitive, caseInsensitive)              
        }
    });

}(["Alabama","Alaska","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois","Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland","Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana","Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York","North Dakota","North Carolina","Ohio","Oklahoma","Oregon","Pennsylvania","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]);
于 2012-11-26T15:49:59.103 に答える
0

@SamuelCaillerieの使用アプローチに同意しますmatcher-これは、抽出機能を使用しているだけです。そう:

    updater: function(item) {
        return this.$element.val().replace(/[^,]*$/,'')+item+',';
    },
    matcher: function (item) {
      var previouslySelected = (this.query.indexOf(item) != -1); 
      var tquery = (previouslySelected ? "" : extractor(this.query));
      if(!tquery) return false;
      return ~item.toLowerCase().indexOf(tquery)
    },
于 2012-11-26T16:09:45.207 に答える