0

ええ、タイトルはめちゃくちゃです。

これが私がやろうとしていることです：私は2つのオプションから選択できる1つのメインドロップダウンリストを持っています。Option1、およびOption2。Option1が選択されている場合、何も起こらないようにします。Option2が選択されている場合、別のドロップダウンリストから1つのオプションタグを削除したいと思います。

<select name="main_dropdown">
    <option value="Option1">Option 1</option>
    <option value="Option2">Option 2</option>
</select>

<select name="secondary_dropdown">
    <option value="Option1">Option 1</option>
    <option value="Option2">Option 2</option> // Let's say i want to remove this option tag if Option2 in main_dropdown is selected.
    <option value="Option2">Option 2</option>
</select>

ありがとう！

4

2 に答える 2

1

必要なコードを他の人に書いてもらうのではなく、自分で答えを見つけようとするコードを質問に含めると、より良い回答と注目を集めることができると思います。人々が自由な仕事をしているように感じたくないという理由だけでなく、答えるのがはるかに難しくなります。

たとえば、あなたがやろうとしているのはかなり基本的なjavascriptですが、それを解決する方法はたくさんあります。これがあなたの質問に対する簡単な答えです（jQueryを使用）：

<script>
  $(document).ready(function(){
    $('select[name=main_dropdown]').bind('change',function(){
      if($(this).val() == 'Option2') $('select[name=secondary_dropdown] option[value=Option2]').remove();
    });   
  });
</script>

<select name="main_dropdown">
    <option value="Option1">Option 1</option>
    <option value="Option2">Option 2</option>
</select>

<select name="secondary_dropdown">
    <option value="Option1">Option 1</option>
    <option value="Option2">Option 2</option> // Let's say i want to remove this option tag if Option2 in main_dropdown is selected.
    <option value="Option2">Option 2</option>
</select>

実際の動作をご覧ください。

とはいえ、このソリューションは非常に脆弱です。この場合は必要なことを実行しますが、関係が変更されたり、コードがより複雑になったりした場合など、あまり良い解決策ではありません。サンプルコードがないと、オプションのターゲットに使用している基準を特定できません。そしてそれらを取り除くので、あなたに多くのことをすることは不可能です。

いくつかの優れたチュートリアルがあるjQueryライブラリから始めることをお勧めします。試してみると、このような問題を自分でかなり早く解決できるはずです。コードが機能しなくなり、どこを向いたらよいかわからない場合でも、恐れることはありません。ここの人々が喜んでお手伝いしてくれると確信しています。

于 2010-10-30T16:55:17.957 に答える
0 
<option value="Option2" id="ToBeOrNotToBe">Option 2</option>

'main_dropdown'の値が"Option2"（比較を行う）の場合、.removeChild（）を使用して "secondary_dropdown"からdocument.getElementById（ "ToBeOrNotToBe"）を削除します。document.getElementById（）を使用して要素を取得し、.removeChild（）を使用してすべてを操作できるように、すべての選択に一意のIDと名前を指定することをお勧めします。removeChild（）に渡すパラメーターは、option2になります。

ただし、removeChild（）は削除したオブジェクトを返すため、別の変数に格納します。したがって、ユーザーがメインドロップダウンで気が変わった場合は、削除されたoption2を子として「secondary_dropdown」に追加します。

また、私の意見では、最初にメインドロップダウンを作成し、値を選択したら、appendChild（）を使用してドキュメント自体に2番目のドロップダウンを作成します。ご覧のとおり、http：//www.w3schools.com/tags/tag_option.aspには、オプションにアタッチできるイベントリスナーが表示されているため、オプションを選択したら、最初のドロップダウンの下に2番目のドロップダウンを挿入し、それに応じて作成します。

高速でシンプルなソリューションが必要な場合は、メインドロップダウンのオプションが選択されたときにイベントリスナーを使用してアクティブ化し、それに応じてoption2を削除するか追加します。

于 2010-10-30T15:01:13.310 に答える