当遇到循环table时,查看其中的td、tr属性和值会有一点的麻烦。此时就必须使用$(this)来解决这一类的问题了。

1.直接使用

2.间接使用

<table>

<?php foreach($shoplist as $v){ ?>
<tr>
<td>{$v.goods_name}</td>
<td>颜色:灰色</td>
<td id="num">
<div class="c_num" goods_id="{$v.goods_id}">
<input type="text" value="{$v.number}" name="" class="car_ipt" />
</div>
</td>
<td id="jiage">¥{$v['number'] * $v['price']}</td>
<td id="update"><a goods_id="{$v.goods_id}">删除</a></td>
</tr>
<?php }; ?>
</table>

<script>
//1.直接在事件中使用 (父级事件发生后,获取子类的值)
$("#update a").click(function(){
$goods_id=$(this).attr("goods_id");
})

//2.$(this).parent().next().html()不起作用是,可分为两步去完成
//这是$(this)的第二种用法(间接使用,可与find()、parent()等,联合使用)
$(".c_num").click(function(){

div=$(this).parent(); //第一步

$goods_id=$(this).attr("goods_id");
$number=$(this).find(".car_ipt").val();
//alert($number+$goods_id);
$.ajax({
type:"get",
url:"{:U('home/buycar/number')}",
data:"goods="+$goods_id+"&number="+$number,
success:function(msg){

div.next("td").html("¥"+msg); //第二步

}
})
})

</script>

html

 代码如下 复制代码
<p class="item">
<input type="text" name="meta_key[164]" value="file1" size="20"  /><a href="/18" id="164" class="button remove">remove</a>
</p>

需求说明:
鼠标点击‘remove’链接,根据ajax的返回值删除页面元素。

无效的方法

 代码如下 复制代码
$('.remove').bind('click',function(){
    
   $.ajax({
   type:'post',
   url:$(this).attr('href'),
   dataType : 'json',
   data:{id : $(this).attr('id')},
   success:function(msg){
      if(msg.error==0){
        alert(msg.msg);
     }else{
        $(this).parent().remove(); //此处无法获得父级元素
     }
     } 
    
    });
   return false;
   });

有效的方法

 代码如下 复制代码
$('.remove').bind('click',function(){
   
   div=$(this).parent(); //先获取父级元素
   
   $.ajax({
   type:'post',
   url:$(this).attr('href'),
   dataType : 'json',
   data:{id : $(this).attr('id')},
   success:function(msg){
    if(msg.error==0){
     alert(msg.msg);
    }else{
      div.remove(); //再删除
    }
     } 
    
    });
   return false;
   });

其他类似问题也可以通过相同方法解决

转载于:https://www.cnblogs.com/kekjiuyue/p/6017229.html

jquery 里 $(this)的用法相关推荐

  1. ajax异步后台存放购物车表,jQuery购物车插件jsorder用法(支持后台处理程序直接转换成DataTable处理)...

    本文实例讲述了jQuery购物车插件jsorder用法.分享给大家供大家参考,具体如下: JSORDER 案例 案例一:我的菜单(点击菜名即可加入菜单) 红烧豆腐 12元 毛血旺 32元 套餐:京酱肉 ...

  2. jQuery中slice()方法用法实例

    本文实例讲述了jQuery中slice()方法用法.分享给大家供大家参考.具体分析如下: 此方法可以选取匹配元素集的子集. 语法结构: 复制代码 代码如下: $(selector).slice(sta ...

  3. html中字段是日期控件,jQuery日历插件datepicker用法详解

    jQuery是一款不可多得的非常优秀的javascript脚本开发库,而基于其上的很多插件也是非常规范和卓越的,如果错过这番美景真是太可惜了,比如datepicker这个插件. 一般MIS系统的前端, ...

  4. css()用法,jQuery的css()方法用法实例

    本文实例讲述了jQuery的css()方法用法.分享给大家供大家参考.具体分析如下: 此方法返回或设置匹配元素的一个或多个样式属性. 语法结构: 语法一: 取得指定样式属性的属性值.以样式属性名称作为 ...

  5. Jquery 循环map的用法

    //Jquery 循环map的用法 $.each(map,function(key,values){console.log(key);$(values).each(function(){console ...

  6. jQuery中extend的用法

    jQuery中extend的用法 前言 一.Jquery的扩展方法原型是: 二.省略dest参数 1.$.extend(src) 2.$.fn.extend(src) 三.Jquery的extend方 ...

  7. 前端基础-jQuery的事件的用法

    阅读目录 常用事件 事件绑定 移除事件 页面载入 一.常用事件 1.鼠标事件之click事件 用交互操作中,最简单直接的操作就是点击操作.jQuery提供了两个方法一个是click方法用于监听用户单击 ...

  8. jQuery遍历not的用法

    从包含所有段落的集合中删除 id 为 "selected" 的段落: $("p").not("#selected") 定义和用法 not() ...

  9. 详细介绍jQuery.outerWidth() 函数具体用法

    outerWidth()函数用于设置或返回当前匹配元素的外宽度.外宽度默认包括元素的内边距(padding).边框(border),但不包括外边距(margin)部分的宽度.你也可以指定参数为true ...

  10. oracle+get+json,jQuery+ajax中getJSON() 用法实例

    实例 从 test.js 载入 JSON 数据并显示 JSON 数据中一个 name 字段数据: $.getJSON("test.js", function(json){ aler ...

最新文章

  1. python中字典dict的中的copy和deepcopy
  2. 21、C#里面类的创建和使用
  3. CSS选择器笔记,element element和element element 的区别
  4. maven springboot 除去指定的jar包_SpringBoot的运行机制
  5. sliverlight3 学习 2, 布局
  6. 【Matlab】设置绘图窗口大小及颜色
  7. mysql-The-server-quit-without-updating-PID-file
  8. 去掉Win7资源管理器左侧不需要的项目
  9. FISCO BCOS 区块链 零知识证明 可监管
  10. d520笔记本linux无线网卡驱动下载,无线网卡万能驱动
  11. 微信红包随机数字_微信红包随机算法初探
  12. java mis_关于使用java开发Mis系统的相关内容。
  13. 计算机怎么连接手机网络,电脑怎么连接手机的热点上网?
  14. 13.SpringBoot学习(十三)——JDBC之 Spring Boot Jpa多数据源
  15. 在 Cocos Creator 中使用缓动系统(cc.tween)
  16. 穿越时空的爱恋-Z80 CPU的前世今生
  17. k8s使用volume将ConfigMap作为文件或目录直接挂载_【大强哥-k8s从入门到放弃06】Secret详解...
  18. 用计算机亩换算成平方,亩数和平方换算(平方米换算亩计算器)
  19. Halcon之图像采集
  20. 浅谈Word中文档标题及编号的设置

热门文章

  1. 2.12 主成分分析(上)
  2. 一体化服务器和oracle集群,4种Oracle DBaaS部署模式,你在使用哪一种?
  3. git对指定commitid 打tag_git 回退版本到之前提交的tag或commit内容代码
  4. 【计算机网络】 —— 标准化工作及相关组织
  5. leetcode - 1025. 除数博弈
  6. Tensorflow入门之运算篇
  7. toj 4319 盒子游戏
  8. 贪心法——部分背包问题
  9. 嵌入式linux 零基础-实践起步 --- 002 --- 配置虚拟机的网络连接
  10. python axes_python matplotlib中axes与axis的区别?