2014-10-03 71 views
-1

嗨,大家好,我製作了2個網站,根據數組我已經編程了徽標應該改變。我正在嘗試爲此使用JavaScript。根據IF,ELSE語句更改JavaScript徽標

場地變量已被編程並正常工作,所以我只需要填寫if語句下的部分。這些徽標都具有相同的類,因爲它們將完全插入同一個點,但顯然會根據if語句是否爲true而發生更改。

我如何得到這個if語句來處理圖像?任何建議都會很棒。

這裏我的代碼:

<script type="text/javascript"> 
       //this not working yet changes the logo depending on the selected location 
      if (venue = "london"){ 
      //SOMETHING TO OUTPUT PICTURE ? 
      } 
      else if (venue = "Manchester") 
      { 
       //SOMETHING TO OUTPUT PICTURE? 

      </script> 
        //THIS IS MY IMAGES 
        <img class="logo1" src="image1"/> 
         <img class="logo1" src="image2"/> 
+0

在哪裏你想加載圖像? – DevelopmentIsMyPassion 2014-10-03 17:25:38

+0

因爲標誌需要根據其已經開發的場地陣列上改變..所以,如果場地是倫敦,我需要顯示不同的標誌,如果在曼徹斯特 – 2014-10-03 17:26:33

回答

2

簡單地做這樣的事情,與attr()方法在jQuery的幫助

jQuery的

$('img.logo1').attr('src',venue=='london'?'image1':(venue=='Manchester'?'image2':'')); 


你也可以嘗試以下m ethod如評論所說的 Ismael Miguel

var imgs={london:'image1',manchester:'image2'}; 
$('img.logo1').attr('src',imgs[(venue+'').toLowerCase()]); 

HTML

<img class="logo1" src=""/> 
+2

爲什麼不'VAR IMGS = {倫敦的場地:「圖像1」,曼徹斯特: '圖像2'}; 。[...] ATTR( 'SRC',IMGS [(場地+ '')toLowerCase()。]);'? – 2014-10-03 17:29:39

+0

@IsmaelMiguel也不錯的主意 – 2014-10-03 17:31:19

+0

你可以把它添加到你的答案,由''


分離。 – 2014-10-03 17:37:59

1

使用比較操作==,而不是賦值運算符=

+0

對圖像沒有幫助,但仍然是一個好點。 – 2014-10-03 17:27:13

0

你不是一個單一的測試相等=。嘗試改變

if (venue = "london"){ 
//SOMETHING TO OUTPUT PICTURE ? 
} 
else if (venue = "Manchester") 
{ 
//SOMETHING TO OUTPUT PICTURE? 

if (venue === "london"){ 
//SOMETHING TO OUTPUT PICTURE ? 
} 
else if (venue === "Manchester") 
{ 
//SOMETHING TO OUTPUT PICTURE? 

退房此鏈接:http://www.w3schools.com/js/js_comparisons.asp

0

您可以通過多種可能的方式做到這一點。我recommande你是添加類您的圖像,像這樣:

HTML

<img class="logo1 hidden london" src="image1"/> 
<img class="logo1 hidden manchester" src="image2"/> 

CSS

.hidden{display:none} 

** * JS

if (venue == "london"){ 
    $('.london').removeClass('hidden'); 
} 
else if (venue == "Manchester") 
{ 
    $('.manchester').removeClass('hidden); 
} 
+0

隱藏關閉報價缺失。另外,如果對應用程序很重要,那麼有些解決方案不涉及每次加載兩個圖像。 – Ben 2014-10-03 17:30:48