Question

我尝试使用twitter boostrap下拉插件进行可编辑的下拉菜单。现在我有这个：http://jsfiddle.net/U9L2J/3/

我想要做的是在列表的每个元素的右侧放置一个铅笔图标和一个删除图标（<i class="icon-pencil"></i>和<i class="icon-remove"></i>）。并在单击这些图标时触发事件。因此，当单击这些图标时，不应检查元素的复选框。我尝试过的所有东西都完全破坏了列表的CSS ......

有什么想法吗？

Answer 1

对于那些处理点击事件的人，你应该使用.on（）：

进行映射

    $(".icon-remove").on("click", function(e){
    alert('clicked');
    e.preventDefault();
});

Your Updated Fiddle

修改：代码更正：

    $("#layers-dropdown >.layers").on("click","li a label i.icon-remove", function(e){
        alert('clicked');
    e.preventDefault();
});

Updated Fiddle with dynamic functionality

Answer 2

使用preventDefault停止选中复选框。

$("i").click(function(e){
  e.preventDefault();
  // some code here - do your thing!
});

请参阅http://jsfiddle.net/PcjNz/

当然，您应该将不同的点击事件绑定到不同的图标。此示例仅阻止选中复选框...

自定义twitter bootstrap下拉列表

2 个答案: