Question

function prepareEventHandlers() {    
    var myImga = document.getElementsByTagName('img');

    myImga.onclick = function () {
        alert("This is Eminem Known As RAP God. The Best Rapper ever");
    }
}

window.onload = function () {
    prepareEventHandlers();
}

为什么这个函数没有在JavaScript中运行。

Answer 1

将myImga.onclick修改为myImga[0].onclick。它适用于第一个元素..

Answer 2

你想要做的事情没有多大意义，但是通过使用jquery你可以很容易地实现。

问题在于您正在获取元素数组，本机javascript不支持在元素数组上设置单击事件。此外，如果页面上没有img，您的代码将失败并在代码中进一步破坏其他javascript代码。另一方面，如果您使用jquery和点击事件，它将为您检查，并在加载javascript后加载图像时使点击可访问。

希望这有帮助

首先包括jquery：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

然后您只需将其添加到您的页面

即可

<script>    
     $('img').on(document, 'click', 
        function() {
           alert("This is Eminem Known As RAP God. The Best Rapper ever");
        }
     );
</script>

Answer 3

你需要一个for循环来遍历返回的对象：

function myAlert(){
        alert("You clicked the picture. Good for you.");
}

function prepareEventHandlers() {    
    var myImga = document.getElementsByTagName('img');

    for(var i=0,l=myImga.length; i<l; ++i) myImga[i].onclick = myAlert;
}

window.onload = function () {
    prepareEventHandlers();
}

在浏览器中测试它是可能的，也许是值得的。使用control-shift-J以chrome形式显示开发人员工具 - 你甚至可以从Stackoverflow尝试这个 - 然后输入：

myImga = document.getElementsByTagName('img')

你将立即看到myImga是一个数组。

如果使用匿名函数设置警报，则for line也适用于浏览器开发人员工具。快乐的警报。

Answer 4

你可以使用：

<script>
function prepareEventHandlers() {    
    var myImga = document.getElementsByTagName('img');
for(x in myImga){
    myImga[x].onclick = function () {
        alert("This is Eminem Known As RAP God. The Best Rapper ever");
    }
}
}

window.onload = function () {
    prepareEventHandlers();
}
</script>

附加onclick到img元素不起作用

4 个答案: