使用javascript或jquery中的通配符选择器将事件绑定到动态生成的元素

时间:2017-01-05 13:50:22

标签: javascript jquery

我有这段代码:

  var element= document.getElementsByRegex('^signalo-.*');
    $(document).on( 'click', element, function(){
        alert($(this).attr('id'))
    } );

我的id按钮数量未知,全部以"signalo-"开头,后面有一个数字,例如signalo-1signalo-2 ....

我知道如何在我的代码示例中看到如何在页面上绑定动态生成元素的事件,但问题是,对于事件绑定,您必须将特定选择器作为第二个参数传递,这会让我感到困惑。 我知道如何使用纯javascript和jQuery使用通配符,我知道将事件绑定到动态内容很热,但我无法弄清楚如何将它们组合在一起。

有人可以帮忙吗?

1 个答案:

答案 0 :(得分:5)

您可以使用jQuery' s属性以'开头选择器来实现这个目标:



$(document).on('click', '[id^="signalo-"]', function() {
  console.log($(this).prop('id'))
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="signalo-1">signalo-1</div>
<div id="signalo-2">signalo-2</div>
<div id="notsignalo-1">notsignalo-1</div>
<div id="signalo-3">signalo-3</div>
&#13;
&#13;
&#13;