大佬教程收集整理的这篇文章主要介绍了如何将重复的jQuery代码整合到一个函数中？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
这是我正在做的事情.我有一个有10个热点的区域地图.将鼠标悬停在每个热点上,然后移动div的背景(id = diaLPAD)以显示其他数据(在精灵中).
例如：
$('#dial1')
// On mouse over,move the BACkground on hover
.mou@L_450_7@ver(function() {
$('#diaLPAD').css('BACkgroundPosition','0 -120px');
})
// On mouse out,move the BACkground BACk
.mou@L_450_7@ut(function() {
$('#diaLPAD').css('BACkgroundPosition','0 0');
})
$('#dial2')
// On mouse over,'0 -240px');
})
// On mouse out,'0 0');
});
...
我想要做的是将该代码合并到一个函数中,我只是从每个区域ID传递垂直偏移图.
有人可以帮忙吗？
$('#dial1,#dial2').hover(
function() { changePosition('0 ' + (parseInt(this.id.match(/\d+$/)[0])) * -120 + 'px'); },function() { changePosition('0 0'); }
);
function changePosition(position) {
$('#diaLPAD').css('BACkgroundPosition',position);
}
更新：
或者,如果页面上的“热点”与索引号的顺序相同,那么您可以采用稍微更高效的方法并为它们提供所有类,并使用.each()的index属性来确定正确的索引数.
$('.hotspots').each(function( idx ) {
$(this).hover(
function() { changePosition('0 ' + ((idx + 1) * -120) + 'px'); },function() { changePosition('0 0'); }
);
});
function changePosition(position) {
$('#diaLPAD').css('BACkgroundPosition',position);
}
实际上,如果你不想要它,你真的不需要changePosition()函数.代码足够短,重复一点也不是什么大问题.
$('.hotspots').each(function( idx ) {
$(this).hover(
function() { $('#diaLPAD').css('BACkgroundPosition','0 ' + ((idx + 1) * -120) + 'px')},function() { $('#diaLPAD').css('BACkgroundPosition','0 0'); }
);
});
以上是大佬教程为你收集整理的如何将重复的jQuery代码整合到一个函数中？全部内容，希望文章能够帮你解决如何将重复的jQuery代码整合到一个函数中？所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。