2016-09-26 136 views
0

我有一個在我的文檔頭部指定的樣式。我在一個部門指定背景圖片,但後來需要改變它,如果用戶點擊鏈接,但我試圖做的一切拒絕工作。通過JavaScript更改樣式圖像

<style type="text/css"> 
      /*Some CSS*/ 
      .large { 
       background: url('/images/artwork1.jpg') no-repeat; 
} 
</style. 

<div class="large"></div> 
<img id="main_image" alt="Image"/> 
<img onclick="javascript:document.getElementById('main_image').sr‌​c='/images/artwork2.‌​jpg'; $('.large').css({'background-image':'url(/images/artwork2.jp‌​g)';" alt="Change Image"/> 

我試圖把背景圖像帶出風格,但點擊鏈接並沒有改變它。我試過JavaScript和jQuery。

+0

請發表您的HTML開始以及:) – RasmusGlenvig

+2

_「但一切我試圖做拒絕工作」 _ - 我們沒有看到任何的問題提供:( – Rayon

+0

粘貼[標籤](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/label)'javascript:'在你的onclick函數的前面是毫​​無意義的。它並沒有聲明你在用JavaScript編寫代碼 – Quentin

回答

0

添加以下代碼下點擊事件

var element = document.querySelector(".large"); 

element.style.background = "url('/images/artwork1.jpg') no-repeat; 
}"; 
+0

我無法讓它工作,我認爲它可能與所有嵌套引號有關。 –

2
large 

這是一個類型選擇器,它匹配<large>元件。

類選擇與.

$('.large').css({'background-image':'url(/images/artwork2.jpg)'; 
+0

我可以將JavaScript和jQuery混合到同一個onclick中嗎? –

+0

Eh? jQuery是一個JavaScript庫。即它只不過是「其他人寫的JavaScript函數」。 – Quentin

+0

這是整個onclick聲明。 ($''large')。css({'background-image':'url(/ *)。'); –