如果未按下该按钮,则在30秒内自动执行该功能
Execute the function automatically in 30 seconds, if the button is not pressed
我想在我的网页中添加以下功能:如果用户在30秒内没有按下"接受"按钮,则$('#popupBoxAccept').click( function() {..}
将自动执行。
$(document).ready(function() {
loadPopupBox();
});
function loadPopupBox() { // to load the Popupbox
$('#popup_box').fadeIn("slow");
}
$('#popupBoxAccept').click( function() {
//...
});
$('#popupBoxDecline').click( function() {
//...
});
<div id="popup_box">
<a id="popupBoxAccept">Accept</a>
<a id="popupBoxDecline">Decline</a>
</div>
jsFiddle演示
var tim = setTimeout(function(){
$('#popupBoxAccept').click();
},30000);
在手册中点击:
$('#popupBoxAccept').click(function(){
clearTimeout(tim);
// ........
});
正如@Elias所建议的:
$('#popupBoxDecline').click( function() {
clearTimeout(tim);
//...
});
一个简单的选项是使用标志和setTimeout
函数:
var clicked = false;
$("#popupBoxAccept").click(function() {
clicked = true;
//...
});
setTimeout(function() {
if (!clicked) {
$("#popupBoxAccept").click();
}
}, 30000);
尝试这个
setTimeOut(function(){
$('#popupBoxAccept').click( function() {
//...
});
}, 30000);
只需设置一个超时:
var tim;//global, I'll provide a (more complex) solution that doesn't need them, too
function loadPopupBox() { // to load the Popupbox
$('#popup_box').fadeIn("slow");
tim = setTimeout(function()
{
$('#popup_box').click();
},30000);
}
$('#popupBoxAccept').click( function() {
clearTimeout(tim);
});
现在,在不使用EVIL全局变量的情况下:
$(document).ready(function()
{
(function(popup,accept,decline)
{
popup.fadeIn("slow");
var tim = setTimeout(function()
{
accept.click();//<-- access to reference is preserved
},30000);
accept.click(function()
{
clearTimeout(tim);
//do accept stuff
});
decline.click(function()
{
clearTimeout(tim);//<-- need that here, too!
//do decline stuff
});
})($('#popup_box'),$('#popupBoxAccept'),$('#popupBoxDecline'));
//pass all 3 elements as argument --> less typing, and is more efficient:
//the DOM is only searched once for each element
});
为什么这有用?简单:您现在可以在另一个上下文中使用var tim
,而不会丢失对超时的引用。闭包,这个名字说明了一切:所有的变量和引用都整齐地捆绑在同一个范围内,不能访问,但在它们被声明的范围内:
var foo = (function()
{
var invisible = 'Now you see me';
return function()
{
return invisible;
}
};
console.log(invisible);//<-- undefined
var invisible = 'Now you don''t';
console.log(foo());//<-- Now you see me
console.log(invisible);//Now you don''t
试着把它放在$(document).ready()
调用中:
setTimeout(function() {
if(!clicked) {
$('#popupBoxAccept').click();
}
}, 30000);
然后更改
$('#popupBoxAccept').click( function() {
//...
});
至
var clicked = false;
$('#popupBoxAccept').click( function() {
clicked = true;
//...
});
相关文章:
- 我想用Javascript网站在开放的Chrome浏览器上执行功能
- 如果未按下该按钮,则在30秒内自动执行该功能
- 如果在编辑中下拉值发生变化,如何执行功能
- 在周一上午8点至晚上7点之间执行功能
- 对页面上的所有ID执行JS功能
- 使用html 5对元素执行自定义表单验证功能
- 如何在ng中继器运行中执行功能
- 具有onclick功能的自定义复选框在实际切换复选框之前执行功能
- 基于条件执行功能
- clearInterval无法执行shuffle功能
- 页面内容加载完毕后执行Jquery功能
- 自动执行Javascript中的功能,用于评测实现
- 为什么不是't点击按钮时执行的功能
- Chrome扩展 - 如何使用按钮单击功能执行javascript文件
- Meteor功能执行了两次
- 分配和功能执行
- 有条件地延迟功能执行
- 功能执行后禁用键
- JS多功能执行
- 如何停止定时器,如果功能执行正确