Javascript/HTML：onClick图像警报不起作用

Question

我已经看遍了所有的堆栈溢出，仍然无法找到我正在寻找的答案。我对JavaScript非常陌生（不是Java的新手）。我试图在点击图像X时在我的网站X上创建一个“页面”。

<img name= "pageXSymbol" src="IMAGEURL"> 

我的JavaScript代码是这样的：

$("pageXSymbol").on("click", function() { 
    alert("Are you sure you want to delete this page?")); 
}); 

我并不想真正删除“网页”，但，我只是试图让警报弹出点击时。点击图片时没有发生任何事情。

Answer 1

你必须针对name属性

$("[name='pageXSymbol']") 

你选择的目标标记名，所以$("pageXSymbol")将匹配<pageXSymbol></pageXSymbol>

jQuery selectors

Answer 2

<img name= "pageXSymbol" id = "pageXSymbol" src="IMAGEURL"> 

的javascript：

$('#pageXSymbol').click(function() { 
    alert("Are you sure you want to delete this page?")); 
}); 

Answer 3

当您使用$("pageXSymbol") - jQuery的尝试访问<pageXSymbol> HTML元素，而不是<img name="pageXSymbol">

为了让你的代码工作中使用应通过name attribite访问元素：

$("img[name=pageXSymbol]").on("click", function() { 
    alert("Are you sure you want to delete this page?")); 
}); 

Answer 4

这应该有助于...

HTML：

<img id="XSymbol" name="pageXSymbol" src="URL"> 

JS：

$("#XSymbol").click(function() { 
    alert("Handler for .click() called."); 
}); 

请参阅JQuery Click Function。