Javascript 类型错误：$(...).addEventListener 不是函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/34767630/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
TypeError: $(...).addEventListener is not a function
提问by Levent Tulun
setTimeout(function() {
$.ajax({
url : "handlers/H_AnnotationHandler.php",
data : "case_id=<?=$case_id?>&plink=<?=$plink?>&mode=get",
type : "post",
dataType : "json",
success : function (response) {
if (!response.error) {
annotation_length = response.annots.length;
for (var i = 0; i < response.annots.length; i++) {
var elt = document.createElement("div");
elt.id = "runtime-overlay" + i;
elt.className = "highlight";
viewer.addOverlay({
element: elt,
location : viewer.viewport.imageToViewportRectangle(parseInt(response.annots[i].rect_x), parseInt(response.annots[i].rect_y), parseInt(response.annots[i].rect_w), parseInt(response.annots[i].rect_h))
});
$("#runtime-overlay"+i).attr("onclick", "$.clickOverlay('"+i+"')");
}
}
}
});
}, 3000);
$.clickOverlay = function(whichOverlay) {
var flag = 0;
$("#runtime-overlay"+whichOverlay).addEventListener("mousedown", function(){
flag = 0;
}, false);
$("#runtime-overlay"+whichOverlay).addEventListener("mousemove", function(){
flag = 1;
}, false);
$("#runtime-overlay"+whichOverlay).addEventListener("mouseup", function(){
if(flag === 0){
console.log("click");
}
else if(flag === 1){
console.log("drag");
}
}, false);
}
Why i get an type error for addeventlistener ? Can you help me, i try to understand click or drag. so i added that functions in my click event : How to distinguish mouse "click" and "drag"
为什么我收到 addeventlistener 的类型错误？你能帮我吗，我试着理解点击或拖动。所以我在我的点击事件中添加了该功能： 如何区分鼠标“点击”和“拖动”
ERROR : Uncaught TypeError: $(...).addEventListener is not a function
错误：未捕获的类型错误：$(...).addEventListener 不是函数
回答by Zesar
As a comment pointed out, You are trying to use the "vanilla" javascript way to add an eventlistener on a jQuery object.
正如评论指出的那样，您正在尝试使用“vanilla”javascript 方式在 jQuery 对象上添加事件侦听器。
$.clickOverlay = function(whichOverlay) {
var flag = 0;
$("#runtime-overlay"+whichOverlay).addEventListener("mousedown", function(){
flag = 0;
}, false);
$("#runtime-overlay"+whichOverlay).addEventListener("mousemove", function(){
flag = 1;
}, false);
$("#runtime-overlay"+whichOverlay).addEventListener("mouseup", function(){
if(flag === 0){
console.log("click");
}
else if(flag === 1){
console.log("drag");
}
}, false);
}
instead try:
而是尝试：
$.clickOverlay = function(whichOverlay) {
var flag = 0;
$("#runtime-overlay"+whichOverlay).on("mousedown", function(){
flag = 0;
});
$("#runtime-overlay"+whichOverlay).on("mousemove", function(){
flag = 1;
});
$("#runtime-overlay"+whichOverlay).on("mouseup", function(){
if(flag === 0){
console.log("click");
}
else if(flag === 1){
console.log("drag");
}
});
}
回答by Léo Martin
addEventListeneris the javascript way to listen for events, but you call it on a JQuery object.
Give a look at JQuery.on()to manage events using JQuery.
addEventListener是侦听事件的 javascript 方式，但您在 JQuery 对象上调用它。看看JQuery.on()使用 JQuery 管理事件。
