-1

I would like to change the particular html table cell colour while the mouse click event occurs. Which one is most suit to my need whether CSS or Javascript?

user2677233
  • 1

4 Answers4

0

Here is a jquery function that should do the trick

$(document).on('click', '#tableID', function(e){
         $(this).css('background','#000080');
    });
Jez D
  • 1,461
  • 2
  • 25
  • 52
0

Here is jquery function to change particular html table cell color when mouse click event occurs.

CODE:

$(document).on('click', '#TABLEID', function(e){
         $(e.target).css('background','#6688ff');
});

DEMO:

http://jsfiddle.net/Ra2VP/

Kiran
  • 20,167
  • 11
  • 67
  • 99
  • Why don't you use `this` instead of `e.target`? – Derek 朕會功夫 Aug 13 '13 at 05:14
  • @Derek朕會功夫: `this` refers to `table element` and color will be applied to whole table. But in question user clearly mentioned that color has to apply only to particular `html cell`. `e.target` will do same. – Kiran Aug 13 '13 at 05:18
  • I thought `this` is referring to the table cell... by the way why don't you use `'#codexpl td'` then `this` will be the same as `e.target`. – Derek 朕會功夫 Aug 13 '13 at 05:22
  • No both are different. If we use `#codexpl td` then color will be applied for all td's in that table. – Kiran Aug 13 '13 at 05:28
  • No it won't. It means the eventListener is applied to the cell. http://jsfiddle.net/DerekL/Ra2VP/2/ – Derek 朕會功夫 Aug 13 '13 at 05:33
0

Refer this for creating click event on table row.

http://stackoverflow.com/questions/1207939/adding-an-onclick-event-to-a-table-row

use css to set the color for the table or by,

mycurrent_row.style.backgroundColor = "#EEF4EA";
AJJ
  • 3,570
  • 7
  • 43
  • 76
0

You can use like this

$('td').click(function(){
    $(this).css('background-color','red');
    $('td').not($(this)).css('background-color','white');
});

See this demo

Bhojendra Rauniyar
  • 83,432
  • 35
  • 168
  • 231