程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 更多編程語言 >> 編程綜合問答 >> javascrpit-jquery toggle()切換兩個函數時報錯

javascrpit-jquery toggle()切換兩個函數時報錯

編輯:編程綜合問答
jquery toggle()切換兩個函數時報錯

$(function() {
var sideRight = $('#sideright');
$('.side-icon').each(function(index){
$(this).toggle(function(){
changeManyElem(sideRight,{'right':0},30);
},function(){
changeManyElem(sideRight,{'right':-350},30);
})
})
})

function getStyle(obj, attr) {
if (obj.currentStyle) {
return obj.currentStyle[attr];
} else {
return getComputedStyle(obj, false)[attr];
}
}
function changeManyElem(obj, json, spd, fn) {
var flag = true;
clearInterval(obj.timer);
obj.timer = setInterval(function() {
for (var attr in json) {
var icur = 0;
if (attr == 'opacity') {
icur = Math.round(parseFloat(getStyle(obj, attr)) * 100);
} else {
icur = parseInt(getStyle(obj, attr));
}
var speed = 0;
speed = (json[attr] - icur) / 10;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
if (icur != json[attr]) {
flag = false;
}
if (attr == 'opacity') {
obj.style[attr] = (icur + speed) / 100;
} else {
obj.style[attr] = icur + speed + "px";
}
}
if (flag) {
clearInterval(obj.timer);
if (fn) {
fn();
}
}
}, spd);
}

最佳回答:


 粗看了一下
 $(function() {
var sideRight = $('#sideright');//這裡獲取的是jquery對象
$('.side-icon').each(function(index){
$(this).toggle(function(){
changeManyElem(sideRight,{'right':0},30);//傳入的是jquery對象
},function(){
changeManyElem(sideRight,{'right':-350},30);
})

看這裡使用
function getStyle(obj, attr) {//這裡obj使用的還是jquery對象,這就不對了,style獲取是dom節點,還有像obj.style[attr],這也是dom方式
if (obj.currentStyle) {
return obj.currentStyle[attr];
} else {
return getComputedStyle(obj, false)[attr];
}

改一下
$(this).toggle(function(){
changeManyElem(sideRight,{'right':0},30);//傳入的是jquery對象
},function(){
changeManyElem(sideRight,{'right':-350},30);
})
這段改成,把sideRight改成sideRight[0],傳入dom節點
$(this).toggle(function(){
changeManyElem(sideRight[0],{'right':0},30);//
},function(){
changeManyElem(sideRight[0],{'right':-350},30);
})
  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved