1

このjsfiddleにはドロップダウンボックスがあります - http://jsfiddle.net/stevea/DFBdk/1/ - 削除できるファイルのリストを保持しています。したがって、実際のアプリケーションでは、削除するファイルごとにリストをドロップダウンしてファイルを選択すると、ファイルが削除され、ドロップダウン リストが閉じます。次に、別のファイルを削除する場合は、もう一度ドロップダウンして別のファイルを選択する必要があります。私が望むのは、リストを下げたままにして、ファイルを次々とクリックして多くのファイルを削除できるようにすることです。完了したらリストを閉じるには、ドロップダウン矢印をもう一度クリックします。

おそらくjQueryを使用して、この動作を実装する方法を見ている人はいますか? 私はselectedIndexでだまそうとしましたが、それは閉じたときにドロップダウンに表示されるアイテムを制御するだけです.

ありがとう

<select id="delete_dropdown" title="delete a page" name="loads">
    <option value="" selected="selected">DELETE</option>
    <option value="DigDil">DigDil</option>
    <option value="a2">a2</option>
    <option value="bob">bob</option>
    <option value="box1">box1</option>
    <option value="box12a">box12a</option>
    <option value="box12d">box12d</option>
    <option value="box17">box17</option>
    <option value="box18">box18</option>
    <option value="box1z">box1z</option>
    <option value="box32">box32</option>
    <option value="box34">box34</option>
    <option value="box789">box789</option>
    <option value="box88">box88</option>
    <option value="box92">box92</option>
    <option value="box93">box93</option>
    <option value="box94">box94</option>
    <option value="boxaa">boxaa</option>
    <option value="boxbb">boxbb</option>
    <option value="boxcc">boxcc</option>
    <option value="boxdd">boxdd</option>
    <option value="boxee">boxee</option>
    <option value="bx12">bx12</option>
    <option value="c1">c1</option>
    <option value="cateye">cateye</option>
    <option value="cdf">cdf</option>
    <option value="dfr">dfr</option>
    <option value="dg">dg</option>
    <option value="dg4">dg4</option>
    <option value="dg5">dg5</option>
</select>
4

3 に答える 3

1

このようなボタンをクリックすると、選択要素の代わりにリスト要素を作成して表示/非表示にすることができます

HTML

<ul>
    <li>1</li>
    <li>2</li>
</ul>

jQuery

$('label:first').on('click', function () {
    $('ul').toggle();
});
$('ul li').on('click', function () {
    $(this).addClass('selected').siblings().removeClass('selected');
});
$('label:last').on('click', function () {
    $('li.selected').remove();
});

デモ

于 2013-09-10T15:09:49.537 に答える