• jq添加新节点赋予class属性并获取该对象


    声明  : 该文的编写纯属个人试验所得 ,供网友借鉴。如有错误,请留言!!!

      首先,添加新节点的class属性不能运用click、change等事件,但能通过类名选择器获取该对象的value值。  

    <div class="div1">
      上传文件 : <input type="file" name="file0"> <br><br>
    </div>
    <button id="btn">获取新添加元素input的值</button>

    </body>
    <script type="text/javascript">
      $(function(){
        $(".div1").on("change","input",function(){
          console.log("on事件成功触发!!!"); //添加一个class属性是div2的元素
        $(this).parent().after("<div class='div2'>上传文件 : <input type='text'> <br><br> <button></button> </div>");
    });

        $("#btn").click(function(){
          var value = $(".div2 input").val(); //获取新添加input输入的值
        console.log("获取到新添加的值是 :"+value);

    });

       利用事件的绑定事件给子代元素绑定一个或者多个事件,可以用on()  bind()  live() , one()  ,但笔者个人认为使用on() 进行绑定更好。通过 .frist的绑定事件可以获取到.div2(即动态添加的元素)的点击事件。 到此完成   

    This is my JSP page. <br>
      <div class="frist">
        <div class="div1">
          上传文件 : <input name="file0" type="file"> <br><br>
          <img src="" style=" 300px;height: 200px">
        </div>
      </div>
    </body>
    <script type="text/javascript">
      $(function(){
        $(".frist").on("change","input",function(){
          console.log("bind事件测试成功!!");
          $(this).parent().after("<div class='div2'>上传文件 <input name='file0' type='file'><br><br><img src='' style=' 300px;height: 200px'></div>");  // 在div1后面添加div2元素  
       });

        $(".frist").on("click",".div2",function(){ //当点击div2时控制台会有输出       该click事件得到响应

          console.log("获取到新增节点!!!");
        });
    });
    </script>

      附  :  当元素更改class属性或者id属性时,直接使用click() change()等事件时获取到的是该元素更改前的class元素, 而不是更改后的class属性。同样需要使用事件的绑定事件。

              希望明天更美好!!!

  • 相关阅读:
    iOS开发——Autolayout下动态调整单元格高度
    iOS开发——随机数的使用
    iOS开发——使用基于Autolayout的ScrollView
    获取OS X中App Store更新后的安装包(如XCode)
    iOS开发——使用Autolayout弹出键盘
    iOS开发——给ImageView添加点击事件
    iOS开发——NSIBPrototypingLayoutConstraint原型约束造成的莫名问题
    iOS开发——异常:[__NSCFNumber length]: unrecognized selector sent to instance
    iOS开发——检测屏幕旋转
    iOS开发——使用Autolayout生成动态高度的TableViewCell单元格
  • 原文地址:https://www.cnblogs.com/ccq-190203/p/10621935.html
Copyright © 2020-2023  润新知