如何使用jquery獲取和設置數據變量？

-1

我的形象有data-web-src，data-tablet-src和data-mobil-src如果我的img標籤有.lazy_res類的，而不是data-web-src到src基於Web .lazyload然後設置值，但如果屏幕（或設備）的平板電腦不是設置data-tablet-src值對src我想這樣做我的網頁上的所有圖片，但我不能在這裏找到解決的辦法，你是我的代碼如何使用jquery獲取和設置數據變量？

$(document).ready(function() { 
 

 
    function noLazyImages(e) { 
 
    var getWebSrc = $(e).attr("data-web-src"); 
 
    var getTabletSrc = $(e).attr("data-tablet-src"); 
 
    var getMobilSrc = $(e).attr("data-mobil-src"); 
 
    if ($(".box img").hasClass("lazy_res")) { 
 

 
     if ($(window).width() > 960) { 
 
     $(e).attr("src", getWebSrc); 
 
     } else if ($(window).width() < 768) { 
 
     $(e).attr("src", getTabletSrc); 
 
     }else if ($(window).width() < 480) { 
 
     $(e).attr("src", getMobilSrc); 
 
     } 
 

 
    } else { 
 
     // do nothing.. 
 
    } 
 

 
    } 
 

 
    noLazyImages(".box img"); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="box"> 
 

 
<img class="lazy_res" data-web-src="http://image.prntscr.com/image/bdf1d94b64104ef2acd2ceee19882cd1.jpg" data-mobil-src="http://image.prntscr.com/image/caa51ab4900448589201207e57b2630f.jpg" data-tablet-src="http://image.prntscr.com/image/4b2862a292b543139daa7805a58c17fd.jpg"/> 
 
    
 
    
 
    
 
</div>

來源

2017-02-09 ani_css

檢查https://api.jquery.com/data/ – Huangism

這可能有助於HTTP設置實例特定值

能做到這一點： //stackoverflow.com/a/5309947/3076934 – amansoni211

呃，使用.attr訪問data- *屬性沒有任何問題。它比使用jQuery的.data更好。 –

你需要遍歷所有的人一個的d獲取和使用attr(function)

function noLazyImages(e) { 
    $(e + '.lazy_res').attr('src', function(_, oldSrc) { 
    var elData = $(this).data(), 
     winWidth = $(window).width(); 
    if (winWidth > 960) { 
     return elData['webSrc'] 
    } else if (winWidth < 768 && winWidth >=480) { 
     return elData['tabletSrc'] 
    } else if (winWidth < 480) { 
     return elData['mobilSrc'] 
    } 
    }) 
}

DEMO

來源

2017-02-09 20:36:58 charlietfl

謝謝，但沒有什麼chane如何申請我的代碼？ –

如何申請？關掉功能。 – charlietfl

我明白了，但我猜測不起作用我剛剛試過:) –

如何使用jquery獲取和設置數據變量？

回答

相關問題