jQuery实现点击该行即可删除HTML表格行


Posted in Javascript onOctober 17, 2014

jQuery的已成为所有时刻的最常用和最喜爱的JavaScript框架之一。它不仅不会减少在JavaScript编码简单的技术开销,而且也使您的代码的跨浏览器兼容。我已经写了许多关于jQuery教程,这个时候,我也用这个简单的纯实现了。任务是从一个HTML表使用一些时髦的效果,只要按一下该行的行。以下是实现这一目标的jQuery代码。

$(document).ready(function() {
$("#sample tr").click(function() {
//change the background color to red before removing
$(this).css("background-color","#FF3700"); 
$(this).fadeOut(400, function(){ 
$(this).remove();
});
});
});

在上面的代码中,我们都附有“#示例”表中的所有“TR”的处理程序。上按一下,我们首先改变该行的背景,然后淡出它并删除它。这是一个简单的任务。

Javascript 相关文章推荐
Jsonp 跨域的原理以及Jquery的解决方案
May 18 Javascript
jquery.Ajax()方法调用Asp.Net后台的方法解析
Feb 13 Javascript
javascript实现图片循环渐显播放的方法
Feb 24 Javascript
JavaScript判断一个字符串是否包含指定子字符串的方法
Mar 18 Javascript
跟我学习javascript的var预解析与函数声明提升
Nov 16 Javascript
浅析jQuery移动开发中内联按钮和分组按钮的编写
Dec 04 Javascript
jquery自定义插件开发之window的实现过程
May 06 Javascript
vue学习笔记之v-if和v-show的区别
Sep 20 Javascript
JavaScript中十种一步拷贝数组的方法实例详解
Apr 22 Javascript
在layui中layer弹出层点击事件无效的解决方法
Sep 05 Javascript
使用 Github Actions 自动部署 Angular 应用到 Github Pages的方法
Jul 20 Javascript
在vs code 中如何创建一个自己的 Vue 模板代码
Nov 10 Javascript
JQuery判断radio是否选中并获取选中值的示例代码
Oct 17 #Javascript
JS判断浏览器是否支持某一个CSS3属性的方法
Oct 17 #Javascript
js onmousewheel事件多次触发问题解决方法
Oct 17 #Javascript
js实现飞入星星特效代码
Oct 17 #Javascript
JavaScript sub方法入门实例(把字符串显示为下标)
Oct 17 #Javascript
JavaScript strike方法入门实例(给字符串加上删除线)
Oct 17 #Javascript
JavaScript link方法入门实例(给字符串加上超链接)
Oct 17 #Javascript
You might like
用php获取远程图片并把它保存到本地的代码
2008/04/07 PHP
php学习之数据类型之间的转换代码
2011/05/29 PHP
PHP实现扎金花游戏之大小比赛的方法
2015/03/10 PHP
详谈PHP编码转换问题
2015/07/28 PHP
PHP实现的折半查找算法示例
2017/12/19 PHP
发布一个基于javascript的动画类 Fx.js
2010/11/05 Javascript
js实现按钮颜色渐变动画效果
2015/08/20 Javascript
使用jQuery制作遮罩层弹出效果的极简实例分享
2016/05/12 Javascript
浅谈jquery上下滑动的注意事项
2016/10/13 Javascript
jQuery实现二维码扫描功能
2017/01/09 Javascript
JS使用正则表达式验证身份证号码
2017/06/23 Javascript
原生JS+CSS实现炫酷重力模拟弹跳系统的登录页面
2017/11/01 Javascript
JavaScript实现的文本框placeholder提示文字功能示例
2018/07/25 Javascript
Layui实现数据表格默认全部显示(不要分页)
2019/10/26 Javascript
vue 对axios get pust put delete封装的实例代码
2020/01/05 Javascript
使用 Github Actions 自动部署 Angular 应用到 Github Pages的方法
2020/07/20 Javascript
前端使用crypto.js进行加密的函数代码
2020/08/16 Javascript
Hadoop中的Python框架的使用指南
2015/04/22 Python
Python和C/C++交互的几种方法总结
2017/05/11 Python
Python实现模拟登录网易邮箱的方法示例
2018/07/05 Python
django框架面向对象ORM模型继承用法实例分析
2019/07/29 Python
Python笔记之facade模式
2019/11/20 Python
Python使用uuid库生成唯一标识ID
2020/02/12 Python
Ubuntu18.04安装 PyCharm并使用 Anaconda 管理的Python环境
2020/04/08 Python
python thrift 实现 单端口多服务的过程
2020/06/08 Python
python新手学习可变和不可变对象
2020/06/11 Python
python 下载文件的几种方法汇总
2021/01/06 Python
说说你所熟悉或听说过的j2ee中的几种常用模式?及对设计模式的一些看法
2012/05/24 面试题
教师的实习鉴定
2013/12/15 职场文书
经理秘书求职自荐信范文
2014/03/23 职场文书
小学生通知书评语
2014/12/31 职场文书
2015年综治宣传月活动总结
2015/03/25 职场文书
2015年秋季小学开学标语
2015/07/16 职场文书
学生早退检讨书(范文)
2019/08/19 职场文书
MySQL系列之五 视图、存储函数、存储过程、触发器
2021/07/02 MySQL
SpringBoot全局异常处理方案分享
2022/05/25 Java/Android