2016-06-07 100 views
0

嗨,當我在下拉列表中選擇紅色我仍然得到backgroundcolor green當我點擊td可以有人幫助嗎?jquery下拉列表都獲得顏色綠色時selecet紅色

$('document').ready(function(){ 
    if ($('#rood').val() == 'Rood'){ 
     $('td').click(function(){ 
      $(this).css('background-color', 'red'); 
     }); 
    } 

    if ($('#groen').val() == 'Groen'){ 
     $('td').click(function(){ 
      $(this).css('background-color', 'green'); 
     }) 
    } 
}); 
<h2>Color</h2> 
<select> 
    <option value="Rood" id="rood">Rood</option> 
    <option value="Groen" id="groen">Groen</option> 
    <option value="Blauw">Blauw</option> 
    <option value="Geel">Geel</option> 
</select> 
+0

如果downvoting,請留下評論爲什麼。雖然這個問題可能不是很先進,但是非常清楚,合理並且可以回答,並且在我看來不應該被低估。 – KjetilNordin

回答

3

您應該驗證在單擊處理條件。

$(document).ready(function() { 
    //Bind the click hanlder 
    $('td').click(function() { 
     //Fetch the value for select 
     var value = $('select').val(); 

     //Fetch the value and compare   
     if (value == 'Rood') { 
      $(this).css('background-color', 'red'); 
     } else if (value == 'Groen') { 
      $(this).css('background-color', 'green'); 
     } 
    }) 
}); 
+3

是的。您正在檢查紅色選項的值爲紅色,選項綠色的值爲綠色。您不檢查選擇哪個選項,因此紅色將始終爲紅色,綠色將始終爲綠色,並且最新的語句將是決定背景顏色的語句 – KjetilNordin

1

@Satpal的答案是正確的,我只是想補充說明爲什麼你的代碼不起作用。

  1. 您還沒有實現任何類型的偵聽器到選擇。除非您告訴它對點擊作出反應,否則選擇不會對任何點擊產生反應。
  2. 您的代碼只會在文檔準備就緒時執行一次。在這裏,你的代碼將這樣寫的:

如果紅色==紅組的背景色爲紅色(設置背景色爲紅色總是)

如果綠色==綠盤背景顏色爲綠色(背景設置顏色爲綠色)

由於沒有添加選擇點擊功能,所以背景顏色將永遠不會設置爲除綠色之外的任何其他顏色。

相關問題