1

私は、JQuery を使用して小さなカスタム ドロップダウンの複数選択に取り組んでいます。

私がやっていることは、別の選択ボックスがクリックされるまで複数選択ボックスを非表示にして、それが入っているブラウザでネイティブに見えるようにすることです.

ただし、複数選択ボックスを通常の選択ボックスの一部のように見せようとしています。

したがって、選択ボックスをクリックすると、複数がそのすぐ下に表示され、その一部のように見えます。

次に、選択を行って元の選択ボックスをクリックすると、複数のボックスが再び消えます。

とにかく、標準ボックス内にある単一のオプションが複数選択ボックスの上に表示され続けることを除いて、これはすべてうまく機能しています。

これを修正するために z-index プロパティを使用しようとしましたが、役に立ちませんでした。

ドロップダウンを非表示にする方法、または実際に無効な属性を設定せずにドロップダウンを本質的に無効にする方法はありますか?

4

3 に答える 3

2

ドロップダウンを無効にする必要はありません.hide()。jQuery を使用している場合は、基本的にstyle=''属性をに設定する単純な複数選択が可能ですdisplay:none;。

$("#your_multiselect").hide(); // .show(); when you want to bring it back.
于 2013-02-28T16:26:10.180 に答える
0

私がやったことは、元の選択ボックス内にオプションがなく、マルチ選択で「最大3つ選択」と表示されているオプションが無効になっているため、クリックした後だけに指示が表示されるようにすることです。

それほど良くはありませんが、機能します。

于 2013-02-28T16:44:41.563 に答える
0

CSS を使用して、選択ボックス内のオプション要素を非表示にすることができます。したがって、複数選択ボックスを表示しているときに、最初の選択ボックスのオプションをプログラムで非表示にすることができます。これにより、現在選択されている値が表示されますが、クリックするとすべてのオプションが非表示になります。

CSS/HTML の短いフィドルは次のとおりです:
http://jsfiddle.net/LWPL3/

CSS

.hidden {
    display: none;
}

HTML

<select>
    <option class="hidden">Option 1</option>
    <option class="hidden">Option 2</option>
    <option class="hidden">Option 3</option>
</select>

そこから、オプション要素を非表示にしたいときはいつでも、メイン選択ボックスのオプション要素に $(optionelements).addClass('hidden') を追加できます。

于 2013-02-28T18:51:17.760 に答える