如何实现 鼠标点击表格行背景变色,移开后点击另一行时另一行变色而前一行恢复原来的背景色
怎么实现 鼠标点击表格行背景变色,移开后点击另一行时另一行变色而前一行恢复原来的背景色
在网上搜了很久,或许是js真心不懂的缘故吧,还是来****来求教各位大神
需要的效果就是下面这个里面的效果一样
http://www.51diaocha.com/w/1049300.htm
我的情况是,页面的代码是整个一个table,然后在后台控制循环加row填充到table里,目前就是想实现这个功能,如何用js来实现,希望代码精简点好。
------解决方案--------------------
用jquery比较容易实现。
或者
------解决方案--------------------
只需要一段JQuery代码:
.ltrv {
background-color:#FFFFFF;
height:35px;
}
<tr class="ltrv" name="pokerCdkExchangeInfo">
<script type="text/javascript">
$(document).ready(function(){
$("tr[name=pokerCdkExchangeInfo]").each(function(i){
$(this).mouseout(function(){this.style.background='white';}).mouseover(function(){this.style.background='#EEEEFF';});
})
})
</script>
在网上搜了很久,或许是js真心不懂的缘故吧,还是来****来求教各位大神
需要的效果就是下面这个里面的效果一样
http://www.51diaocha.com/w/1049300.htm
我的情况是,页面的代码是整个一个table,然后在后台控制循环加row填充到table里,目前就是想实现这个功能,如何用js来实现,希望代码精简点好。
------解决方案--------------------
用jquery比较容易实现。
.active{
backgroundcolor:#ff0000;
}
var $ = require('jquery');
$('table tr').click(function() {
$('table tr').removeClass('active'); // 先将所有class="active"移除,
$(this).addClass('active'); //点击的那个tr添加class="active"
});
或者
$(this).addClass('active').siblings().removeClass('active'); //给当前元素添加active属性,其他全部移除
------解决方案--------------------
只需要一段JQuery代码:
.ltrv {
background-color:#FFFFFF;
height:35px;
}
<tr class="ltrv" name="pokerCdkExchangeInfo">
<script type="text/javascript">
$(document).ready(function(){
$("tr[name=pokerCdkExchangeInfo]").each(function(i){
$(this).mouseout(function(){this.style.background='white';}).mouseover(function(){this.style.background='#EEEEFF';});
})
})
</script>