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，我无法找到允许用户删除元素的方法。

我已经尝试了@Esailija 的建议，这可以删除所有项目：

  $("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 结构），你也明白了。您需要调用removea 的方法，.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 回答