使用拼接將圖像url設置爲背景屬性

下面的串接有什麼問題？使用拼接將圖像url設置爲背景屬性

$(function(){ 

    var bg = "http://i.imgur.com/kqRNO6M.jpg"; 
    var html = '<div style="background:linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)),url(\"'+ bg +'\") no-repeat;">'; 
});

我的演示是在這裏http://jsfiddle.net/su3fpkex/

我逃脫雙引號與\，可就是不工作。

來源

2015-02-05 Fernandez

'console.log（html）'並檢查引號;） – Andreas 2015-02-05 13:44:24

我很困惑......你設置了一些變量，然後不要對它們做任何事情？ – 2015-02-05 13:44:30

試試這個

$(function(){ 

    var bg = "http://i.imgur.com/kqRNO6M.jpg"; 
    var html = '<div style="background:linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)),url(\''+ bg +'\') no-repeat;">'; 

    alert(html); 
});

來源

2015-02-05 13:45:34 dam660

嘗試這樣的：

$(function(){ 

    var bg = "http://i.imgur.com/kqRNO6M.jpg"; 
    var html = '<div style=\'background:linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)),url("'+ bg +'") no-repeat;\'>'; 

});

，記得某處追加你html變量！ :)

來源

2015-02-05 13:45:42 rikpg

也不要忘記把你的html變量附加到dom中...... – Sonaryr 2015-02-05 13:46:35

當然，你必須以某種方式使用你的「html」變量：D它只是解釋如何正確連接這些字符串:) – rikpg 2015-02-05 13:47:39

這個工作，但我不明白這裏的連接，爲什麼從一開始就放棄了？ – Fernandez 2015-02-05 13:54:21

你忘了放在頁面的HTML內容：

$(function(){ 

    var bg = "http://i.imgur.com/kqRNO6M.jpg"; 
    var html = '<div style="background:linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)),url(\''+ bg +'\') no-repeat;">'; 
    $('body').append(html); 
});

來源

2015-02-05 13:57:22

如果你設置你必須設置寬度和高度的div背景圖像。

<div class='img'></div> 

$(function(){ 
    var bg = "http://i.imgur.com/kqRNO6M.jpg"; 
    var html = '<div style="width:300px;height:300px;background-size:cover;background:linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)),url(\''+ bg +'\') no-repeat;">'; 
    $('.img').html(html); 

});

來源

2015-02-05 14:10:25 Dileep

使用拼接將圖像url設置爲背景屬性

回答

相關問題