更改 src 属性不会更新图像
Changing src attribute doesn't update image
作为图片库的一部分，我使用以下代码在用户点击各种缩略图时切换图像元素上的 src 属性。自从我构建它以来，它的每个部分都可以正常工作大约 7 个月，但是在过去几周的某个时候，这部分代码停止工作了：
var nextLgSrc = $('.gallery-image._'+selected).data('lgsrc');
$('.hero-image').attr('src', nextLgSrc);
nextLgSrc 成功返回绝对 URL 到将替换当前图像的图像。并且 img 元素的 src 实际上在单击缩略图时发生了变化，但图像不再发生变化。第一个（默认）图像保持卡住，即使 src 属性在其下方发生变化。
谁能告诉我可能发生了什么以及如何解决它？
这里是完整图库代码的 link，如果有帮助，可以在上下文中查看它：http://pastebin.com/mae8YQi2
实际上，这是一个无法正常工作的页面 link：http://penumbralux.com/project/marisol
因为当您点击第一张以外的图片时，
您只是在更新 img 的 src 属性。
在 chrome 上使用开发人员工具检查元素时，我注意到您的主图片的 srcset 属性也需要更新。我尝试了它并且在更新该图像的 srcset 属性后它工作正常。
<img width="970" height="647" src="http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2349-970x647.jpg" class="hero-image wp-post-image" alt="Caption Test" data-smsrc="http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2363-100x100.jpg" data-lgsrc="Array" srcset="http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2363-300x200.jpg 300w, http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2363-1024x683.jpg 1024w, http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2363-750x500.jpg 750w, http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2349-970x647.jpg 970w" sizes="(max-width: 970px) 100vw, 970px">
所以在一个句子中，同时更新 src 和 srcset。
您正在使用 srcset，它用于在不同宽度的浏览器上响应图像。你也需要更新它
删除 srcset 一切都会按预期进行。如果您希望跨所有浏览器工作，IE 到今天还不支持它。参见 http://caniuse.com/#feat=srcset
此外，预加载图像以使您的页面更具响应性也是个好主意。
作为图片库的一部分，我使用以下代码在用户点击各种缩略图时切换图像元素上的 src 属性。自从我构建它以来，它的每个部分都可以正常工作大约 7 个月，但是在过去几周的某个时候，这部分代码停止工作了：
var nextLgSrc = $('.gallery-image._'+selected).data('lgsrc');
$('.hero-image').attr('src', nextLgSrc);
nextLgSrc 成功返回绝对 URL 到将替换当前图像的图像。并且 img 元素的 src 实际上在单击缩略图时发生了变化，但图像不再发生变化。第一个（默认）图像保持卡住，即使 src 属性在其下方发生变化。
谁能告诉我可能发生了什么以及如何解决它？
这里是完整图库代码的 link，如果有帮助，可以在上下文中查看它：http://pastebin.com/mae8YQi2
实际上，这是一个无法正常工作的页面 link：http://penumbralux.com/project/marisol
因为当您点击第一张以外的图片时，
您只是在更新 img 的 src 属性。
在 chrome 上使用开发人员工具检查元素时，我注意到您的主图片的 srcset 属性也需要更新。我尝试了它并且在更新该图像的 srcset 属性后它工作正常。
<img width="970" height="647" src="http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2349-970x647.jpg" class="hero-image wp-post-image" alt="Caption Test" data-smsrc="http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2363-100x100.jpg" data-lgsrc="Array" srcset="http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2363-300x200.jpg 300w, http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2363-1024x683.jpg 1024w, http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2363-750x500.jpg 750w, http://penumbralux.com/wordpress-2015/wp-content/uploads/2015/07/IMG_2349-970x647.jpg 970w" sizes="(max-width: 970px) 100vw, 970px">
所以在一个句子中，同时更新 src 和 srcset。
您正在使用 srcset，它用于在不同宽度的浏览器上响应图像。你也需要更新它
删除 srcset 一切都会按预期进行。如果您希望跨所有浏览器工作，IE 到今天还不支持它。参见 http://caniuse.com/#feat=srcset
此外，预加载图像以使您的页面更具响应性也是个好主意。