Javascript 在jQuery'方面遇到问题;s click()方法。和事件数据
我正在构建一个小脚本,让您可以动态更改页面的背景图像,以便进行设计比较 我已经安装并运行了一个黑客版本,但我正试图解决这个小问题,以便提高我的JS/jQuery技能 请看这里的JSFIDLE: 我试图修复的代码部分如下:Javascript 在jQuery'方面遇到问题;s click()方法。和事件数据,javascript,jquery,Javascript,Jquery,我正在构建一个小脚本,让您可以动态更改页面的背景图像,以便进行设计比较 我已经安装并运行了一个黑客版本,但我正试图解决这个小问题,以便提高我的JS/jQuery技能 请看这里的JSFIDLE: 我试图修复的代码部分如下: var clickBind = function() { for (var j = 0; j < background.length; j++) { background[j].css({'background': 'url("' +
var clickBind = function() {
for (var j = 0; j < background.length; j++) {
background[j].css({'background': 'url("' + directory + clickBind.data.value + '.jpg")', 'background-size':'cover', 'background-attachment':'fixed'});
crumbSearch[0].css('background', '#F8F8F8');
crumbSearch[1].css({'background': '#F8F8F8'});
if (homepage) {
$('.flexslider').css({'margin-top': '25px'});
}
}
};
for (i = 1; i <= bgOptions; i++) {
bgSwitch.append('<li id="image'+ i + '"></li>');
button.push($('li:last', bgSwitch));
button[button.length - 1]
.css({'background': 'url("' + directory + i + '.jpg")', 'background-size':'cover'})
.click({ value: i }, clickBind);
}
var clickBind=function(){
对于(var j=0;j 对于(i=1;i您应该做一些事情来希望解决这个问题:
首先,for循环应该如下所示
for (i = 1; i <= bgOptions; i++) {
bgSwitch.append('<li id="image'+ i + '"></li>');
button.push($('li:last', bgSwitch));
button[button.length - 1]
.css({'background': 'url("' + directory + i + '.jpg")', 'background-size':'cover'})
// CHANGED:
.click({value:i},function(event) {
clickBind(event.data.value);
});
}
让我知道这是否适合你
编辑:我在你上一次的for循环中改变了一些东西。我不习惯严格模式,所以希望这个方法对你有效。如果不习惯,我们可以寻求其他选择!我忘了提到我在使用严格模式,在for循环中定义函数时会引起臭味。如果可能的话,我希望避免这样做rry!我的小提琴实际上似乎也不起作用了。请检查我的更新答案。它对我有效,但在严格模式下可能不起作用
?我以前从未使用过
var clickBind = function(i) {
for (var j = 0; j < background.length; j++) {
// Replace clickBind.data.value with i:
background[j].css({'background': 'url("' + directory + i + '.jpg")', 'background-size':'cover', 'background-attachment':'fixed'});
crumbSearch[0].css('background', '#F8F8F8');
crumbSearch[1].css({'background': '#F8F8F8'});
if (homepage) {
$('.flexslider').css({'margin-top': '25px'});
}
}
};