2013-03-27 160 views
2

http://harvesthq.github.com/chosen/jquery選擇:填充多個選擇與選項卡按鈕

這裏是示例頁面,它有多選擇輸入。

當我開始輸入時,它突出顯示選項。在這一刻,當我按Tab鍵時,焦點在其他輸入上移動,並且將先前的輸入留空。我想在用戶開始輸入時添加新的選項,例如,用戶輸入'af','Afganistan'突出顯示,用戶按Tab鍵並且必須添加Afganistan。

我試圖處理標籤按鍵,並做$(optionid).click()模擬鼠標或輸入選擇,但它不能正常工作

回答

2

我已經嘗試了所有我能想到,當涉及到所選擇的頂部添加事件處理但無濟於事。我已經嘗試捕捉標籤按下並模擬突出顯示的項目上的點擊並模擬輸入字段上的Enter鍵,但無濟於事。

然而,我認爲如果你願意黑客選擇,只需要一些非常小的變化。

第一個變化:

Chosen.prototype.keydown_checker = function(evt) { 
    ... 
    //Replace the existing "case 9:" with this: 
    case 9: //tab 
     if(!this.is_multiple){ 
      if (this.results_showing && !this.is_multiple) { 
       this.result_select(evt); 
      } 
      this.mouse_on_container = false;   
     } 
     else { 
      evt.preventDefault(); 
     } 
     break; 
    ... 
} 

第二個變化:

AbstractChosen.prototype.keyup_checker = function(evt) { 
    ... 
    case 9: //Simply add this above "case 13:" and remove "case 9:" from further down the switch statement 
    case 13: //Enter 
    ... 
} 

編輯:我現在已經測試了使用其附帶的示例頁面,它似乎是工作。如預期。

+0

謝謝,我會嘗試 – ysokolovsky 2013-03-27 21:47:20

+0

在1.5版本中,我只需要改變'''案例9: 如果(this.results_showing){ this.result_select( EVT); } this.mouse_on_container = false; break;''' – Bob 2016-05-05 16:05:25

0

我已經做了一些改變,並得到我想要的。 thx,Peter Herdenborg!

AbstractChosen.prototype.keyup_checker = function (evt) { ... 
    ... 
    case 9: 
     if (this.search_field.val().length != 0) { 
       if (this.results_showing) return this.result_select(evt); 
     } 
     break; 
    case 13: 
    ... 

和第二

Chosen.prototype.keydown_checker = function (evt) { 
     case 9: 
      if (!this.is_multiple) { 
       if (this.results_showing && !this.is_multiple) { 
         this.result_select(evt); 
        } 
       this.mouse_on_container = false; 
      } 
      else { 
      if (this.search_field.val().length != 0) evt.preventDefault(); 
     } 
     break;