1

個人が を選択し、選択内容を表示して、別の選択を行うために戻ることにした場合にoption disabledタグに更新される HTML ドロップダウン リストを作成するにはどうすればよいですか。option valueoption value

html:

<form>
<select name="URL" onchange="window.location.href=this.form.URL.options[this.form.URL.selectedIndex].value">
<option disabled="disabled" selected="selected">Choose a County for Recycling Information.......</option>
<option value="LINK">Ingham County (Google Map / PDF)</option>
<option value="LINK">Clinton County (PDF)</option>
<option value="LINK">Eaton County (PDF)</option>
</select>
</form>

-select name- タグは、同じウィンドウで開く URL にユーザーをレンダリングします。

<select name="URL" onchange="window.location.href=this.form.URL.options[this.form.URL.selectedIndex].value">

現在のところ、個人がリストから選択し、選択内容を表示 (同じウィンドウで開いて) し、(元の Web ページに) 戻った場合、ドロップダウン メニューは次のようには戻りません:

<option disabled="disabled" selected="selected">Choose a County for Recycling Information.......</option>

ただしoption value、ブラウザー ウィンドウを更新または再読み込みしない限り、タグの選択はそのままです。

4

3 に答える 3

1

基本的に、javascript がないとできません。

あなたがどれだけ知っているかわかりませんので、JavaScript についての予備知識がないことを前提としています。

以下は、あなたが求めていることを行う必要があります。

ご覧のとおり、onchange 属性を変更して、「this」キーワードを使用して DropDown リストをパラメータとして渡す「ResetToDisabled」という JavaScript 関数を呼び出します。

<select name="URL" onchange="ResetToDisabled(this);">
    <option disabled="disabled" selected="selected">Choose a County for Recycling Information.......</option>
    <option value="LINK">Ingham County (Google Map / PDF)</option>
    <option value="LINK">Clinton County (PDF)</option>
    <option value="LINK">Eaton County (PDF)</option>
</select>
<script type="text/javascript">
    function ResetToDisabled(DropDown) {
        var TargetIndex = DropDown.selectedIndex;
        DropDown.selectedIndex = 0;
        window.location.href = DropDown.options[TargetIndex].value;
    }
</script>

ここで何が起こっているかというと、オブジェクト (この場合はドロップダウン リストであると想定できます) をパラメーターとして受け取る "ResetToDisabled" という JavaScript 関数を作成しています。

この関数は、「TargetIndex」という一時変数を作成し、その値をドロップダウンの選択されたインデックスに設定します。

次に、ドロップダウン リストの選択されたインデックスを 0 (最初のオプション) に設定します。

次に、新しい Web ページを開くコード行を実行します。ただし、ドロップダウンを最初のオプションにリセットしたため、クリックして戻ると、それが選択されたオプションとして記憶されます。

私も付け足したほうがいいと思います。多くのサイトがメニューに使用するのと同じ動作を実現しようとしているようです。その場合は、「CSS ドロップダウン メニュー」を検索することをお勧めします。後で変更しようとすると、選択ドロップダウンの外観を変更するのが非常に困難になるためです。

于 2013-04-30T14:07:40.550 に答える
0

これには jquery を使用する必要はありません。

html ファイル;

<form>
<select name="URL" onchange="changeme(this)">
<option disabled="disabled" selected="selected">Choose a County for Recycling Information.......</option>
<option value="LINK">Ingham County (Google Map / PDF)</option>
<option value="LINK">Clinton County (PDF)</option>
<option value="LINK">Eaton County (PDF)</option>
</select>
</form>

js ファイル;

function changeme(mselect ) {
    for (var i = 0; i < mselect.options.length; i++) {
        if (mselect.options[i].selected == true) {
            mselect.options[i].setAttribute('disabled', 'disabled');
        }
        else {
            mselect.options[i].removeAttribute('disabled');
        }
    }
}
于 2013-04-30T13:59:15.297 に答える
0

それらがページに戻る方法に応じて、ページの読み込み時に選択されたインデックスを設定する Javascript を少しだけ持つことができるはずです。

YourHTMLElement.selectedIndex = 0;

ただし、同じ値を選択したままにしておくと、元に戻っているように聞こえhistory.back();、通常のonloadイベントが実行されない可能性があります。

ただし、ここでの回答はそのような問題に役立ちます。これにより、jQuery のドキュメント準備完了イベントを発生させることができます。つまり、リンクしてselectedIndexを 0 にリセットできます。

于 2013-04-30T13:59:24.317 に答える