2011-05-11 22 views
4

私はこれまで、この質問に対する答えを探していましたが、最大の運勢やバグの解決策はありませんでした。ドロップダウンリスト/選択リストで既に選択されている項目を選択してください

私が直面している問題は、すでに選択されているアイテムを選択するときに、(明らかに)「onchange」イベントを発生させない選択要素があることです。このよう

:今

<select onchange="alert(this.value);"> 
<option>1</option> 
<option>2</option> 
<option>3</option> 
</select> 

は、私が最初の項目1を選択すると言います。 その後、私は再び項目1を選択できる必要があります。

この機能は、私が取り組んでいるプロジェクトの成功にとって非常に重要です。

ご協力いただきまして誠にありがとうございます。

編集:(詳細情報)

この機能を素早く国にジャンプするには、ユーザーがドロップダウンでpresentetされているGoogleマップでプロジェクトに取り組んでイムとして必要とされている(例:あなたは「スペイン」を選択Googleマップの設定でスペイン語が表示されます

スペインに行き、地図をドラッグしてイタリアに行きたいときに問題が発生しますが、スペインに戻って私の上司はそれが好きではありません:)

Edit2:Solution

これまでのところ、いくつかの解決策があります。 これらのうちの1つは、onblur(コントロールのフォーカスを外したとき)を投げることです。このになる可能性があるので、同じアイテムを再度選択している人のためにリストをぼかすことができます。彼らが自分でフォーカスを変えない限り、彼らはマップの変更を見ることはありません。

まだ選択肢の選択/クリック/ぼかしなど何かを覚えている病気を見つけるのが難しいのは分かりません。

編集3:それはとにかくするメンターが、十分に近い、少なくとも今のところはしていないとまったく同じように最終的な解決策

は右ので、私は最終的に、この作業を取得するために管理。

私が思いついた解決策は、選択の上部に「国を選択してください」オプションを追加することでした。 その後、私はテキストを変更し、 "国を選択してください"の値を選択したアイテムの値に変更し、選択したインデックスを0にリセットします。 このように、スペインを選択すると、無効状態のリストの状態、さらには動作状態の状態の状態を示す。だから、リストの途中でスペインをクリックしても、まだ選択されていてもスペインに戻ることができます(一番上の項目です)

非常にきれいなアイデアが同僚から提供されました。

スクリプトは次の通りである:

var dummyOption; 
function setdummyCountry(obj) 
{ 
    var selectedOption = obj.options[obj.selectedIndex]; 
    if (dummyOption != null) { 
     dummyOption.text = selectedOption.text; 
     dummyOption.value = selectedOption.value; 
    } 
    else { 
     dummyOption = document.createElement("option"); 
     dummyOption.text = selectedOption.text; 
     dummyOption.value = selectedOption.value; 
     dummyOption.setAttribute("disabled", "true"); 
     obj.options[0] = dummyOption; 
    } 
    obj.selectedIndex = 0; 
} 

<select onchange="setdummyCountry(this);"> 
    <option value="">Please select country</option> 
    <option value="ES">spain</option> 
    <option value="SE">sweden</option> 
    <option value="NO">norway</option> 
</select> 

私はこれが誰かを助けることを願っています!

あなたのアイデアや時間に感謝してくれた人に。

+1

あなたはonclickのにのonchange変更する場合のために、この種のことをしますか? – Paddy

+0

なぜこの動作が必要なのかについての情報を追加できますか? – JohnP

+0

は、すべてのオプションを最初に書き、 'selected'タグで1つ追加するだけでよいでしょう。すべてのオプションが配列にありますか?詳細を説明してください – diEcho

答えて

1

これはおそらくあなたが望むものではないかもしれませんが、あなたが決定できるこの別の選択肢です。 後にするとき、ユーザーの休暇デフォルトに戻す(空1 /最初の)オプション

<select onchange="alert(this.value);this.value='';"> 
<option value='' selected='selected'></option> 
<option>1</option> 
<option>2</option> 
<option>3</option> 
</select> 

それを取得するには、オプションを選択するか、

<select onblur="alert(this.value);"> 
<option>1</option> 
<option>2</option> 
<option>3</option> 
</select> 

を作ることができますが、この方法は、あなたの機能(警告)を呼び出します/ blur/unfocusリスト:p

2

同じアイテムが選択されていると、変更イベントが発生することはありません。私たちは同じ問題に直面していたので、単純な使い勝手のハックでした。アイテムが選択されると、スパンで選択されたアイテムがユーザーに表示され、ドロップダウンの値がデフォルト値(-Select--)にリセットされます。

HTH

1

私は、同じシナリオのためのソリューションを探していると同じためangularjsディレクティブを書いてしまった - selectタグオフフォーカスを削除するためにelement[0].blur();を使用し

guthub link - angular select

。ロジックは、ドロップダウンの2回目のクリックでこのぼかしをトリガーすることです。

as-selectは、ユーザーがドロップダウンで同じ値を選択してもトリガーされます。

DEMO - link

関連する問題