修复Uncaught TypeError所需的信息：无法读取未定义的属性'substr'

Question

下面的脚本当前用于提取URL并在mouseover上执行图像交换。不过，我目前得到未捕获的错误类型：

cannot read property 'substr' of undefined

的代码是：

<script> 
jQuery(document).ready(function(){ 
    jQuery('.hover_box_wrapper').mouseenter(function(){ 
     var img_src = jQuery(this).parent().parent().parent().find('.hover2 img').attr('src'); 
     var img_src_s= img_src.substring(0,img_src.lastIndexOf("?")); 
     var img_href = jQuery(this).parent().attr('href'); 
     var img_src_set = jQuery(this).parent().parent().parent().find('.hover2 img').attr('srcset'); 
     var src = jQuery('.center123').find('img').attr('src'); 
     var res = src.split(" "); 
     var src_first = res[0]; 
     src_first = src_first.substring(0,src_first.lastIndexOf("?")); 

     jQuery('.center123').find('img').attr('src',img_src_s); 
     jQuery('.center123').find('img').attr('srcset',src_first); 

     //var img_html = jQuery('.center123').find('.vc_single_image-wrapper').html(); 
     //jQuery('.center123').find('.vc_single_image-wrapper').html(''); 
     jQuery('.center123').find('.vc_single_image-wrapper').html('<a href="'+ img_href + '"><img src="'+ img_src_s+'" srcset="'+ src_first +'" /></a>'); 
    }); 
}); 

Answer 1

你错误是隐藏在这里，在这一段代码，如果你会调试一行行它：

var src = jQuery('.center123').find('img').attr('src'); 
var res = src.split(" "); 
var src_first = res[0]; 

的情况下，有没有元素找到的属性中找不到src，这等于undefined值存储在src_first变量中。

您需要对结果进行额外的检查，结果存储在res[0]之内。 split(" ")只适用于{String}类型，不适用于undefined。

最简单的额外的检查可以被编码，如：

// ... 
var src = jQuery('.center123').find('img').attr('src'); 
if (! src) { // <== here's the additional check, the simplest case possible 
    return; 
} 
var res = src.split(" "); 
var src_first = res[0]; 
// ...