按钮单击jquery不工作

Question

应该是一个非常简单的答案,但我现在无法弄清楚.我有这个按钮:

<button id="logout" type="button">Logout</button>

它应该在正文底部的脚本标记内运行此jQuery代码:

$("#logout").addEventListener("click", function () {
    alert('Button Clicked');
});

但是,不会弹出警报.我不明白.提前致谢.

Answer 1

addEventListener是一个DOM不是jQueryobject 的元素的方法,它是一个包含所有选定DOM元素的类数组结构

要使用附加事件jQuery,请使用.on=> 将一个或多个事件的事件处理函数附加到所选元素

试试这个:

$("#logout").on("click", function() {
  alert('Button Clicked');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="logout" type="button">Logout</button>

使用JS:

document.getElementById("logout").addEventListener("click", function() {
  alert('Button Clicked');
});

<button id="logout" type="button">Logout</button>

编辑:您可以DOM element从jQuery selector使用$(SELECTOR)[0]或返回的类似数组的对象中获取第一个$(SELECTOR).get(0)