首页 > Web开发 > 详细

Jquery事件

时间:2016-11-17 07:53:50      阅读:193      评论:0      收藏:0      [点我收藏+]

一、Jquery加事件

Jquery第一个事件:页面加载完成事件

没有方法名的函数叫逆名函数;

把方法交给函数的方式叫作委托或代理;

//页面加载完成
$(document).ready();
//把方法作为参数给它
$(document).ready(function(e) { //e代表事件数据,可以写可以不写
   
});

例子:给三个div加事件

<script src="jquery-1.11.2.min.js"></script>
</head>

<body>
<div class="aa" bs="1" style="width:100px; height:100px; background-color:red">11111</div>
<div class="aa" bs="2" style="width:100px; height:100px; background-color:blue">22222</div>
<div class="aa" bs="3" style="width:100px; height:100px; background-color:purple">33333</div>

</body>
</html>
<script type="text/javascript">

$(document).ready(function(e) {
    //1.给三个div加点击事件
    $(".aa").click(function(e) {
        alert("hello world");
  
  //2.取三个div里的值
    $(".aa").click(function(e) { alert($(this).text());
  //3.取三个div里属性值
  $(".aa").click(function(e) {
        alert($(this).attr("bs"));
  
  // 4.给三个div统一加改变属性事件
  $(".aa").click(function(e) {
     $(".aa").css("background-color","red");
      $(this).css("background-color","green");
      });
  }); });
</script>

二、Jquery挂事件

<script src="jquery-1.11.2.min.js"></script>
</head><body>


<div id="a1" style="width:100px; height:100px; "></div>
<input type="text" id="p1" />
<input type="button" id="b1" value="挂事件" />
<input type="button" id="b2" value="移除事件" />

</body>
</html>
<script type="text/javascript">

$(document).ready(function(e) {
 //给三个div加点击事件
  $("#b1").click(function(){
     $("#a1").bind("click",function(){
        alert("我是挂上的事件");
      });
   });
  
    $("#b2").click(function(){
        $("#a1").unbind("click");
   });
});
</script>

 

Jquery事件

原文:http://www.cnblogs.com/wells33373/p/6072186.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!