0

私はこのselectListプラグインを使用していますhttp://odyniec.net/projects/selectlist/

問題は、ユーザーが追加する要素ごとに、数量を指定できるようにすることです。テンプレートでこれを行うことができます：

   $(document).ready(function () {
      $('#mySelect').selectList({
      clickRemove: false,
     template: '<li><a>%text%<a/> - <input id="cnt_%value%" name="cnt%value%" type="text" value="1" /></li>'
      });
   });

clickRemove を false に設定する必要があります。それ以外の場合は、テキスト ボックスをクリックして要素を削除します。ただし、clickRemove: false では、ユーザーが要素を削除できるようにする方法がわかりません。

@Esailja からの提案を試してみましたが、これはすべてのアイテムを削除するために機能します。

  $("ul.selectlist-list").on("click", "a", function () {
     var selectList = $('#mySelect').selectList({ instance: true });
     selectList.remove();
  });

また、ハードコーディングされた ID を remove() に渡すこともできますが、それは機能しますが、削除しようとしている要素に関連付けられた値が見つからないようです。入力要素の値は数量であり、選択したアイテムの ID ではありません。

では、選択したアイテムの値を取得して削除するにはどうすればよいですか?

テンプレートに削除を追加しようとしました:

  template: '<li><a href="#" onclick="$(this).parent().remove()">%text%<a/> - <input id="cnt_%value%" name="cnt%value%" type="text" value="1" /></li>'

これにより、アイテムが表示から削除されますが、再選択することはできません。これを行う方法、またはこのタイプの機能を可能にする別のプラグインはありますか?

4

2 に答える 2

0

これを試してください（インラインハンドラーなし）

$( "ul.selectlist-list" ).on( "click", "a", function(){
    var $this = $(this),
        $input = $this.siblings("input"),
        selectList = $this.closest( ".selectlist-list" ).prev("select").selectList({instance: true});

    selectList.remove( $input.val() );
});

うまくいかなくても (HTML 構造によって異なります)、アイデアは得られます。要素を直接削除するのではなくremove、 a のメソッドを呼び出す必要があります。これは、プラグインがユーザーがこれを行ったことを認識できないためです。.selectList

http://odyniec.net/projects/selectlist/usage.html#api-methods

于 2012-04-04T12:16:23.867 に答える
0

ライブラリのソース コードを確認してください。要素を削除するための解決策があります。

 $list.children().each(function () {
            if ($(this).data('value') == value || typeof value == 'undefined')
                remove($(this));
        });
于 2012-04-04T12:25:04.177 に答える