jQuery 如果宽度小于 .. 更改 src attr，否则，使用前一个答案

【问题标题】：jQuery if width is less then.. change src attr, else, use the previousjQuery 如果宽度小于 .. 更改 src attr，否则，使用前一个
【发布时间】：2017-02-02 14:52:51
【问题描述】：

（对不起我的英语不好，希望你能理解）我希望当窗口width 小于601px 时，带有.logo-wrap 容器的图像的src 属性变为#；当宽度较大时，src attr 作为“原始”返回；代码的第一部分有效，但是在我缩小窗口然后将其放大后，src 属性仍然是#...

有什么建议吗？提前致谢

var $window = $(window);

function checkWidth() {
    var windowsize = $window.width();
    if (windowsize < 601) {
        $(".logo-wrap img").attr("src","#");
    }
    else {}
}
// Execute on load
checkWidth();
// Bind event listener
$(window).resize(checkWidth);

【问题讨论】：

你可以使用media queries

标签： jquery image if-statement src attr

【解决方案1】：

var $window = $(window);

// creates an attribute called data-content for each image and stores it's src
$(".logo-wrap img").each(function() {
  $(this).data('data-content', $(this).attr('src'));
});

function checkWidth() {
    var windowsize = $window.width();
    if (windowsize < 601) {
        $(".logo-wrap img").attr("src","#");
    }
    else {
      // changes each image's src to the link stored in data-content attribute
      $(".logo-wrap img").each(function() {
        $(this).attr("src", $(this).data('data-content'));
      });
    }
}
// Execute on load
checkWidth();
// Bind event listener
$(window).resize(checkWidth);

编辑：添加JSFiddle。

【讨论】：

谢谢！我想尝试这样做，但我认为通过写入变量无论如何它都会采用“#”谢谢！
没问题。只要您在更改之前保存属性，它将保持原始属性。如果现在一切正常，您可以接受答案。
不幸的是，看起来不错，我发现它会产生问题...我有更多 .Logo-wrap 容器，里面有图像；所以当我把它变大时，脚本将第一张图片的 src 属性复制到所有其他图片：-/你有什么建议吗？
您想在一张或全部图片上使用它吗？你能显示html吗？
当宽度小于 601px 时，我需要为所有图像使用#，当窗口较大时，各种图像的每个不同的src 属性。 here an example of HTML

【解决方案2】：

看起来你只是没有将属性改回来，

function checkWidth() {
    var windowsize = $window.width();
    if (windowsize < 601) {
        $(".logo-wrap img, .lab-ah img").attr("src","#");
    }
    else if ( windowsize >= 601) {
        $(".logo-wrap img, .lab-ah img").attr("src","original");
    }
}

希望我能正确理解你的问题

【讨论】：