0

(<ul>)Selectドロップダウン要素の機能を複製するために、この関数を順序付けされていないリストで使用しています。この関数は、チェックされている場合、指定されたコンテナー内のユーザーが選択した値を正しく表示しますが、アイテムがチェックされていない場合、それらを削除しません。

以下に関連するスニペットを含め、完全なコードを含む実用的な例をここに投稿しました:http: //jsfiddle.net/chayacooper/GS8dM/7/

JS

$(document).ready(function () {
     $(".dropdown_box").click(function () {
         $("#select_colors").show();
     });

     $(".dropdown_container ul li").click(function () {
         var text = $(this.children[0]).find("input").val();
         var currentHtml = $(".dropdown_box span").html();        
         $(".dropdown_box span").html(currentHtml.replace('Colors', ''));
         $(".dropdown_box span").append(', ' + text);              
     });
 });

HTML

<div class="dropdown_box"><span>Colors</span></div>
<div class="dropdown_container">
    <ul id="select_colors">
        <li><label><a href="#"><input type="checkbox" name="color[]" value="Black" />Black</a></label></li>
    </ul>
</div>
4

1 に答える 1

0

関数にコンテナIDを指定する必要があります。次に、選択範囲のテキストを追加する前に、それがテキストに含まれていないことを確認する必要があります。そうである場合は、削除します。

于 2013-03-05T03:11:42.933 に答える