我最近为我构建的应用程序部署了一个无限滚动条,发现有时我需要点击两次才能发生。
我的应用程序喜欢,并且一旦dom加载,我需要在它更改之前点击两次类似按钮,然后一旦我点击其他的它没关系,但我总是必须点击一次该应用程序几乎“醒来”
有更好的解决方案吗?
$(document).ready(function() {
function runUpdate(url, item) {
$.ajax({
type: "GET",
url: url,
cache: false,
success: function(data){
if (data == '200') {
removeAddColor(item);
}
}
});
}
$('.mini-like').live('click', function(){
$('.mini-like').toggle(
function() {
var item = $(this);
var href = item.attr('href');
runUpdate(href, item);
},
function() {
var item = $(this);
var rel = item.attr('rel');
runUpdate(rel, item);
}
);
});
function removeAddColorFollow(item) {
var href = $(this).attr('href');
var rel = $(this).attr('rel');
if (item.hasClass('btn-success')) {
$(item).removeClass('btn-success').attr('href', href).attr('rel', rel);
$(item).find('i').removeClass('icon-white');
} else {
$(item).addClass('btn-success').attr('href', rel).attr('rel', href);
$(item).find('i').addClass('icon-white');
};
}
});
答案 0 :(得分:1)
除非我完全错了,否则只需在点击一次后将toggle事件附加到.mini-like。尽量替换
$('.mini-like').live('click', function() {...
使用
$(function() {...
在文档就绪而非点击
上附加切换事件处理程序答案 1 :(得分:0)
代码$('.mini-like').live('click',...
应放在$(document).ready()
您可以使用.on
代替.live
。由于.on
是一种新方法,现在不推荐使用.live
,您应该使用.on
<强>更新强> 重写的版本将是
$(document).ready(function(){
$('.mini-like').on('click', function(){
$('.mini-like').toggle(
function() {
var item = $(this);
var href = item.attr('href');
runUpdate(href, item);
},
function() {
var item = $(this);
var rel = item.attr('rel');
runUpdate(rel, item);
}
);
});
});
function runUpdate(url, item) {
$.ajax({
type: "GET",
url: url,
cache: false,
success: function(data){
if (data == '200') {
removeAddColor(item);
}
}
});
}
function removeAddColorFollow(item) {
var href = $(this).attr('href');
var rel = $(this).attr('rel');
if (item.hasClass('btn-success')) {
$(item).removeClass('btn-success').attr('href', href).attr('rel', rel);
$(item).find('i').removeClass('icon-white');
} else {
$(item).addClass('btn-success').attr('href', rel).attr('rel', href);
$(item).find('i').addClass('icon-white');
};
}