jquery - Jquery Chosen：使用 Tab 按钮填充多项选择

Question

http://harvesthq.github.com/chosen/

这是示例页面，它具有多选输入。

当我开始输入时，它会突出显示选项。在这一刻，当我按下 Tab 按钮时，焦点会移到其他输入上，并将之前的输入留空。我想在用户开始输入时添加新选项，例如，用户输入'af'，'Afganistan'被突出显示，用户按下tab按钮并且必须添加Afganistan。

我试图处理tab键，并$(optionid).click()模拟鼠标或输入选择，但它不起作用

Answer 1

在 Chosen 之上添加事件处理程序时，我已经尝试了所有我能想到的方法，但无济于事。我尝试捕捉标签按下并模拟对突出显示的项目的单击并模拟在输入字段上按下 Enter 但无济于事。

但是我认为，如果您愿意破解 Chosen，只需要进行一些非常小的更改。

第一个变化：

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
    ...
}

编辑：我现在已经使用他们捆绑的示例页面对此进行了测试，它似乎正在工作。如预期。

Answer 2

我做了一些改变，得到了我想要的。谢谢，彼得赫登堡！

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;