Uncaught TypeError: Cannot set property 'onclick' of null

15 浏览
0 Comments

Uncaught TypeError: Cannot set property 'onclick' of null

// 获取模态框\nvar modal = document.getElementById(\'bozy-mymodal\');\n// 获取图片并将其插入模态框中 - 使用图片的“alt”文本作为标题\nvar img = document.getElementById(\'bozy22-popup\');\nvar modalImg = document.getElementById(\"image-01\");\nvar captionText = document.getElementById(\"caption\");\nimg.onclick = function(){\n modal.style.display = \"block\";\n modalImg.src = this.src;\n captionText.innerHTML = this.alt;\n}\n这段代码在我的WordPress主题的custom.js文件中，用于处理图片弹出。但是在首页或其他没有这样的事件处理的页面上，其他在custom.js中编写的JQuery或自定义查询（如Popmenu等）不会执行。有什么解决办法吗？\nUncaught TypeError: Cannot set property \'onclick\' of null\nat custom.js:20\nat custom.js:44\n它似乎在寻找一个名为\'body22-popup\'的图片，在该页面上不存在，但在幻灯片工作的页面上存在。\nvar img = document.getElementById(\'body22-popup\');\n一个类似的情况在这里→\ni\'m getting an Uncaught TypeError: Cannot set property \'onclick\' of null?\n有没有办法在custom.js中执行那部分代码，即使没有可以弹出的图片存在。\n在WordPress中，脚本可以这样添加→\nwp_register_script( \'custom-js\', get_template_directory_uri() . \'/js/custom.js\', array( \'jquery\' ), \'1.1\', true );\nwp_enqueue_script( \'custom-js\' );

0

1 答案

0 Comments

(Uncaught TypeError: Cannot set property 'onclick' of null)问题产生的原因是在尝试分配事件处理程序之前，没有检查到img元素是否存在。

解决方法是在尝试分配事件处理程序之前，确保img元素不为null。可以通过使用getElementById()方法获取img元素，并使用条件语句检查是否成功获取到元素。如果成功获取到img元素，再分配事件处理程序。

以下是解决方法的示例代码：

...
var img = document.getElementById('bozy22-popup');
if ( img ) 
{
    img.onclick = function(){
        modal.style.display = "block";
        modalImg.src = this.src;
        captionText.innerHTML = this.alt;
    }
}

这样做可以避免在页面上不存在img元素时分配点击事件处理程序，从而消除错误。

需要注意的是，这个问题的解决方法只是针对该特定的错误。如果控制台中显示了其他错误，可能需要进一步检查代码以解决其他问题。

0