jQuery技术

请问Jquery的on函数用法

字号+ 作者:H5之家 来源:H5之家 2017-10-23 18:27 我要评论( )

请教Jquery的on函数用法本帖最后由 haokan1113 于 2013-11-02 11:49:33 编辑 NewDocumentdiv{border:1pxsolidblack;cursor:pointer;width:200px;margin:10px;}Al

请教Jquery的on函数用法
本帖最后由 haokan1113 于 2013-11-02 11:49:33 编辑 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style type='text/css'>
div{
border:1px solid black;
cursor:pointer;
width:200px;
margin:10px;
}
  </style>
 </head>

 <body>
  <input type='button' id='button' value='Create New Element'/>
  <div >Already on page</div>

  <script type='text/javascript' src='../jquery.js'></script>
  <script type='text/javascript'>
$(document).ready(function(){
$('#button').click(function(){
$('body').append('<div class="future">I am a new div</div>');
});

$('div').on('click',function(){
$(this).css({'color':'red','font-weight':'bold'}).html('You clicked me');         //想实现单击新增加的div后,会改变div的内容和字体
});
});
  </script>
 </body>
</html>

这里用on添加的click事件始终不执行,请教该如何实现?我现在用的是jquery 1.10.2
------最佳解决方法--------------------
完全 没问题啊

<html>
<head>
  <title>New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style type='text/css'>
    div
    {
      border: 1px solid black;
      cursor: pointer;
      width: 200px;
      margin: 10px;
    }
  </style>
</head>
<body>
  <input type='button' id='button' value='Create New Element' />
  <div >
    Already on page</div>
  <script type='text/javascript' src='jquery-1.10.2.min.js'></script>
  <script type='text/javascript'>
    $(function () {
      $('#button').click(function () {
        $('body').append('<div class="future">I am a new div</div>');
      });

      $('body').on('click', "div",function () {
        $(this).css({ 'color': 'red', 'font-weight': 'bold' }).html('You clicked me');         //想实现单击新增加的div后,会改变div的内容和字体
      });
    });
  </script>
</body>
</html>

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • jquery调用另外一个function方法

    jquery调用另外一个function方法

    2017-10-24 10:13

  • jQuery实现最简单实用的分秒倒计时

    jQuery实现最简单实用的分秒倒计时

    2017-10-23 11:11

  • 拖放效果的是实现(Draggable)

    拖放效果的是实现(Draggable)

    2017-10-23 10:01

  • 请教jquery dataTable能否实现跨页全选?

    请教jquery dataTable能否实现跨页全选?

    2017-10-23 10:00

网友点评
c