2014-10-07 95 views
0

我想補充data屬性與jQuery的DOM元素,但只有當$(window).width是大於800像素。所以現在我有這樣的代碼,它不工作。添加自定義數據屬性的DOM元素

注:Chrome開發者工具不報告代碼中的任何問題。

代碼:

<div id="wallpaper"></div> 
<div id="wallpaper-right"></div> 
<div class="container"></div> 

jQuery的

var width = $(window).width(), 
    wallpapers = $("#wallpaper, #wallpaper-right"), 
    container = $(".container"); 

if (width > 800) { 
    wallpapers.data("stellar-ratio") === 0.1; 
    container.data("stellar-ratio") === 1; 
} 
加入 data屬性後

所需的結果HTML:

<div id="wallpaper" data-stellar-ratio="0.1"></div> 
<div id="wallpaper-right" data-stellar-ratio="0.1"></div> 
<div class="container" data-stellar-ratio="1"></div> 

回答

1

的第二個參數你也可以試試這個

if (width > 800) { 
     wallpapers.attr({"data-stellar-ratio":"0.1"}); 
     container.attr({"data-stellar-ratio":"1"}); 
    } 
+0

是的,這按預期工作。謝謝! – 2014-10-07 17:30:33

+0

歡迎@BlazKranjcev – 2014-10-07 18:27:40

4

設定數值爲data屬性,你應該通過它作爲.data()實現方法具的第二個參數d:

wallpapers.data("stellar-ratio", 0.1); 
container.data("stellar-ratio", 1); 

你已經寫在這裏是比較data-stellar-ratio和0.1

之間或1

值,並鍵入以下是 doc.data()

1

設置的數據值,你需要把它作爲方法

var width = $(window).width(), 
    wallpapers = $("#wallpaper, #wallpaper-right"), 
    container = $(".container"); 

if (width > 800) { 
    wallpapers.data("stellar-ratio",0.1); 
    container.data("stellar-ratio",1); 
}