如何在触发点击事件后执行警报
How to execute alert after trigger click event
我正在尝试在执行触发器事件后执行警报消息。我的代码:
$(".addpage").trigger("click").queue(function () {
alert($(".page:first-child").attr("id"));
});
但这里的问题是警报在完成触发事件功能之前执行。我做错了什么?
使用.queue(回调),您将在元素用于元素效果(动画)的标准"fx"队列的末尾添加一个新函数。因此,如果.click()事件处理程序不包含任何元素动画,则.cqueue()回调将立即生效。
这里我已经为上述问题完成了完整的bin。请找到演示链接并查看。。
演示:http://codebins.com/bin/4ldqp7m
HTML
<ul id="pages">
<li class="page" id="1">
Page-1
</li>
<li class="page" id="2">
Page-2
</li>
<li class="page" id="3">
Page-3
</li>
<li class="page" id="4">
Page-4
</li>
</ul>
jQuery
$(function() {
$(".addpage").click(function(e) {
var newId = parseInt($("#pages li.page:last").attr('id')) + 1;
$("#pages").append("<li class='page' id='" + (newId) + "'>Page-" + (newId) + "</li>");
});
$(".addpage").trigger('click');
$(".addpage").queue(function() {
alert("New Page with Id #" + $("#pages li.page:last").attr('id') + " has been added...!");
});
});
CSS:
#pages{
list-style:none;
margin:5px;
padding:2px;
width:120px;
}
#pages li{
border:1px solid #1A1A1A;
width:120px;
background:#4fdefd;
text-align:center;
}
.addpage{
background:#53a5f9;
border:1px solid #1142fd;
}
.addpage:hover{
background:#53cdfa;
}
演示:http://codebins.com/bin/4ldqp7m
相关文章:
- 如何在onclick事件执行代码时在ImageButton上设置加载gif
- 如果类有多个事件处理程序方法,如何防止多个事件执行
- 单击事件执行单击和悬停事件处理程序,即使单击事件处理程序取消绑定所有处理程序也是如此
- 对多个滚动事件执行一次操作并防止滚动
- jQuery全局/本地事件执行顺序
- 作为预生成事件执行PowerShell脚本失败
- 允许对目标事件执行默认操作,并阻止对父级执行默认操作
- 使用点击jquery事件执行css3转换
- 阻止.mouseout事件执行
- 无法通过键盘事件执行功能
- 循环中的Javascript onclick事件执行了1次以上
- 如何将多个事件处理程序添加到同一个html元素中,并根据事件执行不同的方法
- 在Angular 2中处理click和clickOutside事件执行优先级的最佳方式
- 在mustache模板中对点击事件执行函数
- Java脚本函数,直到save事件执行完成
- 每个事件执行多次代码:多次下载
- 当onclick事件执行异步代码时,我如何在新选项卡请求中打开
- 在所有控制器中对同一个事件执行同一个函数——AngularJS
- Jquery事件执行两次
- 对img load事件执行html注释