Question

想要替换图像

HTML：

    <a href="#"><img src="products.jpg"  alt="products" /></a>
    <a href="#"><img src="another-image.jpg"  alt="another-image" /></a>

Answer 1

在更改图像源之前，使用jQuery函数 .data（）保存它们。然后，当您单击它们还原src属性。像这样：

if ( $(window).width() <= 480 ) {

    $('img').each(function (i, k) {
        $(k).data('src', $(k).attr('src'));
        $(k).attr('src', 'temp_image.jpg');
    });

    $('img').click(function () {
        $(this).attr('src', $(this).data('src'));
    });
}

参考： http://api.jquery.com/data/

Answer 2

应该很容易。

首先，.click（）将函数绑定到事件单击，并将对象调用为on。你不能（你可以，但它不会像你期望的那样工作）绑定.each（）中的事件

尝试这样的事情：

<div id="banner">
    <a href="#"><img src="banner.jpg" id="realImg1" alt="banner" /></a>
    <a href="#"><img src="another-image.jpg" id="realImg2" alt="another-image" /></a>
</div>


<script>
    $(document).ready(function() {

        var counter = 0;
        var toggle_images = function () {

              if (counter % 2) // if pair, change all pics to "dummy.jpg"
              {
                  $('img').each(function
                  ({
                        $(this).attr('src', 'dummy.jpg');
                  };
              }
              else  // if odd restore its initial src (you can recycle the value in alt)
              {
                   $('img').each
                   ({
                       // get the name from the alt property and append '.jpg'
                       var pic_path = $(this).attr('alt') + '.jpg'
                       $(this).attr('src', pic_path); 
                   });
              }
              counter += 1;

        };

        $('img').click(toggle_images);  // bind the event
</script>

替换内容jquery

2 个答案: