javascript - 双击添加的选择选项不起作用

原文 标签 javascript jquery select option

我有两个选择,它们都使用函数将元素添加到另一个选择。
这是我所拥有的:

$("#lecturers option").dblclick(function () 
{
    var element = $("#lecturers option:selected");
    var value = element.val();
    element.remove();
    var values = value.split(";")

    $("#selected_lecturers").append('<option value="' + value + '">' + values[2] + ', ' + values[1] + '</option>');

});

反之亦然:

http://jsfiddle.net/VJAJB/

它以某种方式只工作一次,并且新添加的元素不会触发该功能。

关于如何解决这个问题的任何想法?

最佳答案

问题是如何绑定(bind) dblclick元素的作用。当前选择器仅返回您在 select 中的选项元素。绑定(bind)时的元素。要改变这一点,您可以使用委托(delegate)事件。

$('#lecturers').on('dblclick', 'option', function() {
    //Do stuff here
});

这样可以确保您添加到 select 元素的任何选项元素在双击时都会触发此事件。

这是一个更新的 fiddle :http://jsfiddle.net/VJAJB/4/

请注意,其他用户已经为您提供了可行的解决方案。但是,最佳实践是限制绑定(bind)到文档本身的事件数量。只要有可能,您应该将委托(delegate)的事件监听器绑定(bind)到最近的 不变元素。

关于javascript - 双击添加的选择选项不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20477321/

相关文章:

javascript - 在 react 应用程序中通过 react-bootstrap css 应用自定义字体粗细样式面临困难

javascript - 具有多个目录的窗口位置路径名

javascript - Jquery animate() 不起作用

使用 GROUP BY 时的 MySQL SUM 不起作用

mysql - 在另一列mysql中显示结果集值

javascript - 为什么 anchor 标签在tinymce编辑器中消失了?

javascript - jQuery传递变量问题

javascript - jQuery或javascript中是否存在诸如 'if (!Page.IsPostBack)'之类的东西?

javascript - $ ("#id option").hide();不在 safari/chrome 上工作?

javascript - 如何获取带有选定文本的div?