Question

我是Javascript的新手，并尝试将事件处理程序附加到选择列表。这是我的HTML：

<select id="x_selector"></select>

我成功地添加了一堆选项。但是我想添加一个on change方法。这个jquery javascript工作：

let xsel = $("#x_selector");
xsel.on("change", event => {console.log(event)});

但这并不是：

var xSelector = document.getElementById('x_selector');
xSelector.on("change", event => {console.log(event)});

对于后者，我得到一个控制台TypeError：xSelector.on不是函数。

那么document.getElementById和jquery选择器之间有什么区别？

Answer 1

.on是一个jQuery方法。使用vanilla javascript，请使用.addEventListener。

Answer 2

试试这个：纯粹的工作

document.getElementById("x_selector").addEventListener("change", myFunction);

function myFunction() {
    var x = document.getElementById("x_selector");
    x.value = x.value.toUpperCase();
}

Enter your name: <input type="text" id="x_selector">

jquery选择器工作但document.getElementById不用于添加ES6事件

2 个答案: