HTML/Javascript - 選択したインデックスをonFocusに設定して同じオプションを2回選択する

Question

同じオプションを2回選択しても関数を呼び出すselectを実装しようとしています。このthreadの回答に続いて、selectedIndexを-1に設定しました。しかし、同じオプションが2回選択されても、私はまだ関数呼び出しを取得していません。

var scaleSelect = new ComboBox({ 
     id: "scale_select", 
     style: {width: "150px"}, 
     name: "scale_select", 
     placeHolder: "Choisir une échelle", 
     store: scaleStore, 
     disabled: true, 
     onFocus: function() { 
     this.selectedIndex = -1; 
     console.log(this.selectedIndex); //-1 
     }, 
     onChange: function(value){ 
     mapScale = value; 
     window.myMap.setScale(mapScale); 
     } 
    }, "scale_select"); 
    scaleSelect.startup(); 

のonChange以内に選択されたインデックスを設定しようとするUPDATEはまだ関数を呼び出していない - これは、選択したインデックスが未定義のonChangeであるという事実に関係している場合

var scaleSelect = new ComboBox({ 
     id: "scale_select", 
     style: {width: "150px"}, 
     name: "scale_select", 
     placeHolder: "Choisir une échelle", 
     store: scaleStore, 
     disabled: true, 
     onChange: function(value){ 
     mapScale = value; 
     window.myMap.setScale(mapScale); 
     var mySelect = document.getElementById("scale_select"); 
     console.log(this.selectedIndex) //undefined 
     this.selectedIndex = -1; 
     mySelect.selectedIndex = -1; 
     console.log(this.selectedIndex); //-1 
     console.log(mySelect.selectedIndex); //-1 
     } 
    }, "scale_select"); 
    scaleSelect.startup(); 

Answer 1

..不思議を

だから、問題は、選択した値を選択しても、フォーカスが失われないということです。したがって、onFocusハンドラは、ユーザがページの他の場所を実際にクリックしない限り呼び出されません。彼女がそれをしないと、同じ値を再び選択すると、selectの値はonChangeを発生させません。

フォーカスを選択したインデックスを設定するのではなく、変更を処理した後にonChangeで行うのはなぜですか。そうすれば、あなたの選択は、現在の選択を処理し終わるとすぐに、別の選択のために下塗りされます。

更新OK、その道場のコードを見て、これは私が思い付くことが最高です：あなたは値なしで全体のことを起動する必要があり

var scaleSelect = new ComboBox({ 
    id: "scale_select", 
    style: {width: "150px"}, 
    name: "scale_select", 
    placeHolder: "Choisir une échelle", 
    store: scaleStore, 
    disabled: true, 
    onChange: function(value){ 
    if(value) { // the .reset() call below will fire the onChange handler again, but this time with a null value 
     mapScale = value; 
     window.myMap.setScale(mapScale); 
     console.log("Changed to", value, this); 
     this.reset(); // This is the magic here: reset so you are guaranteed to isseu an "onChange" the next time the user picks something 
    } 
    } 
}, "scale_select"); 
scaleSelect.startup(); 

注 - そうでなければ初期値は "onChange"イベントを発行せず、ウィジェットをリセットするたびに初期値に戻ります。

これは役に立ちます。

Answer 2

私は成功しなかったことをすべて知っていました。私はあなたがリンクしupvotesで答えるスレッドについて不思議です！なぜなら、選択されたオプションはもうオプションではないからです。しかし、私は提案を持っている：

をそれだけでテキストボックスと線でいくつかのリンクラインとその下のdiv要素である

を選択して独自のカスタムを作成します。