2015-03-30 24 views
0

我有一個asp.net應用程序。我正在使用jquery ajax調用從服務器端檢索數據並顯示它。如何在jquery ajax成功事件上應用不同的css樣式?

這裏是我的代碼,

<div> 
    <table class="window_month" style="margin-top: 15px; text-align: center;"> 
     <tr id="NavigationMonth"> 
      <td id="mo1" runat="server" onclick=""> 
      Jan 
      </td> 
      <td id="mo2" runat="server" onclick=""> 
      Feb 
      </td> 
      <td id="mo3" runat="server" onclick=""> 
      Mar 
      </td>         
     </tr> 
    </table> 
</div> 

<script type="text/javascript"> 
    $('.window_month td').on('click', function() { 
    var ddl = $("#ddlYear option:selected").text(); 
    var idName = this.id; 
    var selectedid = idName.substring(2); 

    var param = { 
     month: selectedid, 
     year: ddl 
    }; 

    var strParam = JSON.stringify(param); 

    $.ajax({ 
     type: "POST", 
     url: "Default.aspx/GetSelectedTDData", 
     contentType: "application/json;", 
     data: strParam, 
     async: false, 
     dataType: "json", 
     success: function (result) { 
      alert('Yay! It worked!'); 
      var response = result.d; 
      $('#lblValid').text(response[0]); 
      $('#lblNotValid').text(response[1]); 
      $('#mo' + selectedid).css('backgroundColor', '#aaa'); 
     }, 
     error: function (result) { 
      alert('Oh no :('); 
     } 
    }); 
}); 
</script> 

上面的代碼突出了被點擊的HTML TD元素,但是當我點擊另一個TD元素上,它應該忘記在最後點擊的元素,並突出一個新的。

目前它不會忘記最後點擊的元素。我怎樣才能做到這一點?

回答

0

試試這個, 您應該從所有TD去除背景,然後將其添加到作爲TD剛剛點擊

$('.window_month td').css('backgroundColor', 'non highlighted color code'); 
$('#mo' + selectedid).css('backgroundColor', '#aaa'); 
+0

它從所有的td元素中刪除背景顏色。我想要突出顯示單擊的td元素。 – nrvbha 2015-03-30 19:55:23

+0

從所有td中刪除背景,然後添加到您單擊的td中,使用編輯的答案 – Farhan 2015-03-30 19:56:18

0

它完成。

for (var i = 1; i <= 12; i++) { 
    if (i == selectedid) { 
     $('#mo' + selectedid).css('backgroundColor', '#aaa'); 
    } 
    else { 
     $('#mo' + i).css('backgroundColor', '#f5f5f5'); 
    } 
}