日期:2014-05-16  浏览次数:20420 次

求大神帮忙解决js鼠标移入事件
想通过js改变class属性 当鼠标移入时改变图片,css中有"_on"的是改变后的图片  "求大神帮忙~~ 

下面是图例





.qie1_dt{background:url('../img/qiehuan1.jpg') no-repeat left top;}
.qie1_dt_on{background:url('../img/qiehuan1.jpg') no-repeat -123px top}

.qie1_bm{background:url('../img/qiehuan1.jpg') no-repeat left -54px;}
.qie1_bm_on{background:url('../img/qiehuan1.jpg') no-repeat -123px -54px}

.qie1_cx{background:url('../img/qiehuan1.jpg') no-repeat left -119px;}
.qie1_cx_on{background:url('../img/qiehuan1.jpg') no-repeat -123px -119px}

.qie1_lq{background:url('../img/qiehuan1.jpg') no-repeat left -173px;}
.qie1_lq_on{background:url('../img/qiehuan1.jpg') no-repeat -123px -173px}




<ul class="qiehuan1">
     <li><a href="" class="qie1_dt_on"></a></li>
     <li><a href="" class="qie1_bm"></a></li>
     <li><a href="" class="qie1_cx"></a></li>
     <li><a href="" class="qie1_lq"></a></li>
 </ul>

------解决方案--------------------

var a="qie1_dt_on";
$("ul.qiehuan1 a").mouseover(function(){
    if(/_on$/.exec(this.className)){
       return;
    }else{
       $("ul.qiehuan1 a."+a).attr("className",a.replace(/_on$/,""));
       this.className=this.className+'_on';
    }
});

试试
------解决方案--------------------
用jquery吧  方便些~~

$(function(){
$('.qiehuan1 li a').hover(function(){
$('.qiehuan1 li a').each(function(){
var start=$(this).attr('class').indexOf('_on');
if(start){
var newClass=$(this).attr('class').replace(/_on/,'');