1

これが私の例です。

<select name="mydropdownbox">
<option value="val1">val1</option>
<option value="val2">val2</option>
<option value="val3">val3</option>
<option value="val4">val4</option>
<option value="val5">val5</option>
<option value="val6">val6</option>
</select>​

ご覧のとおり、さまざまなオプションを備えた選択ボックスがあります。私がやりたいのは、val2とval5でオプションを非表示にすることですが、リストの最後に。のような別のオプションを追加します<option value="more">more</option>。

「詳細」をクリックすると、非表示のオプションが表示されます。オプション「more」はオプション「less」に置き換える必要があります。クリック数を減らすと、オプションが再び非表示になります。

これは単なる例であることに注意してください。完全なリストには、50を超えるオプションが含まれています。ある種の配列に役立つでしょうか？

残念ながら、どうやって始めたらいいのかわかりません。これに関する助けをいただければ幸いです。ありがとう。

更新 jsの私のコメントを見てください-パートhttp://jsfiddle.net/bqyBQ/5/

4

2 に答える 2

0

「詳細」オプションでリンクを作成します。より多くのオプションをクリックすると、javascriptまたはjqueryを呼び出し、スクリプトからデータを動的に追加し、より多くのキャプションを切り替えたり、操作を追加および削除したりする必要があります

于 2012-08-23T13:22:20.697 に答える
0

私はこのようなことを試みます

<select id="mydropdownbox" name="mydropdownbox">
    <option value="val1">val1</option>
    <option value="val2">val2</option>
    <option value="val3">val3</option>
    <option value="val4" class="hide">val4</option>
    <option value="val5" class="hide">val5</option>
    <option value="val6" class="hide">val6</option>
    <option value="more" class="more">more</option>
</select>​

<style type="text/css">
  .hide { display: none; }
</style>

<script type="text/javascript">
  jQuery('#mydropdownbox .more').click(function() { 
    jQuery('#mydropdownbox .hide').attr('class', 'show');
  });
</script>

これらの要素に新しいクラスを配置するだけで、デフォルトでは非表示になっているはずです。次に、クリックイベントをその他のリンクに追加して、これらのクラスを切り替えます。このテクニックでもボタンを少なくするのは簡単でしょう。

于 2012-08-23T13:33:51.890 に答える