模拟操作

<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="js/jquery.min.js"></script>
</head>
<body>
  <button id="btn">点击</button>
  <div class="test"></div>
<script type="text/javascript">

/*1.模拟操作

有时候需要模拟用户操作,来到达到点击效果。例如,在用户进入页面之后,就触发click事件,而不需要用户去自动点击。在jquery中,可以用trigger()方法去完成模拟操作。

*/
$(function(){
  $("#btn").one('click', function() {
    /* Act on the */
    $(".test").append('<div>我绑定的函数1</div>')
  }).one('click', function() {
    /* Act on the */
    $(".test").append('<div>我绑定的函数2</div>')
  }).one('click', function() {
    /* Act on the event */
    $(".test").append('<div>我绑定的函数3</div>')
  });
    $("#btn").trigger('click');

/*2.自定义触发事件

trigger()方法不仅能触发浏览器支持的具有相同名称的事件,也能触发自定义的事件。

*/
  $("#btn").bind('myClick', function(event) {
    /* Act on the event */
    $(".test").append('<p>我的自定义事件</p>')
  });
    $("#btn").trigger('myClick');
})

</script>
</body>
</html>

提示:

1.trigger()方法触发事件后,会执行浏览器的默认操作。例如:

$("input).trigger("focus");

注意:如果只想触发绑定的focus事件,而不想执行浏览器的默认操作,可以只用jquery中另外一个方法--triggerHandler();

 

posted @ 2017-03-31 13:41  代码小精灵  阅读(337)  评论(0编辑  收藏  举报