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 相关文章推荐
Javascript下的keyCode键码值表
Apr 10 Javascript
关于Ext中form移除textfield方法:hide(),setVisible(false),remove()
Dec 02 Javascript
Javascript中this关键字的一些小知识
Mar 15 Javascript
jQuery实现的类似淘宝网站搜索框样式代码分享
Aug 24 Javascript
jQuery中常用的遍历函数用法实例总结
Sep 01 Javascript
10个很棒的jQuery代码片段
Sep 24 Javascript
jQuery中事件与动画的总结分享
May 24 Javascript
详解原生js实现offset方法
Jun 15 Javascript
基于react后端渲染模板引擎noox发布使用
Jan 11 Javascript
利用d3.js力导布局绘制资源拓扑图实例教程
Jan 08 Javascript
Vue-cli3.x + axios 跨域方案踩坑指北
Jul 04 Javascript
优雅的使用javascript递归画一棵结构树示例代码
Sep 22 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
新版mysql+apache+php Linux安装指南
2006/10/09 PHP
刚才在简化php的库,结果发现很多东西
2006/12/31 PHP
PHP分页显示制作详细讲解
2008/11/19 PHP
PHP6新特性分析
2016/03/03 PHP
php array 转json及java 转换 json数据格式操作示例
2019/11/13 PHP
JavaScript中的undefined学习总结
2013/11/30 Javascript
查找Oracle高消耗语句的方法
2014/03/22 Javascript
JavaScript中的Math 使用介绍
2014/04/21 Javascript
jQuery标签替换函数replaceWith()的使用例子
2014/08/28 Javascript
jQuery插件jquery-barcode实现条码打印的方法
2015/11/25 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(一)
2016/02/16 Javascript
jQuery事件委托之Safari
2016/07/05 Javascript
Yarn的安装与使用详细介绍
2016/10/25 Javascript
setTimeout函数的神奇使用
2017/02/26 Javascript
原生JS实现自定义滚动条效果
2020/10/27 Javascript
微信小程序实现跑马灯效果完整代码(附效果图)
2018/05/30 Javascript
使用Vue开发自己的Chrome扩展程序过程详解
2019/06/21 Javascript
vue实现百度语音合成的实例讲解
2019/10/14 Javascript
ES6 proxy和reflect的使用方法与应用实例分析
2020/02/15 Javascript
vue 导出文件,携带请求头token操作
2020/09/10 Javascript
[03:07]DOTA2英雄基础教程 冰霜诅咒极寒幽魂
2013/12/06 DOTA
Python pickle模块用法实例
2015/04/14 Python
听歌识曲--用python实现一个音乐检索器的功能
2016/11/15 Python
python 文件操作删除某行的实例
2017/09/04 Python
Python实现重建二叉树的三种方法详解
2018/06/23 Python
Python设计模式之建造者模式实例详解
2019/01/17 Python
python openpyxl使用方法详解
2019/07/18 Python
深入了解Python在HDA中的应用
2019/09/05 Python
css3实现波纹特效、H5实现动态波浪效果
2018/01/31 HTML / CSS
什么是JNDI的上下文?如何初始化JNDI上下文
2012/03/10 面试题
婚前协议书
2014/04/15 职场文书
《猴子种果树》教学反思
2014/04/26 职场文书
群众路线剖析材料怎么写
2014/10/09 职场文书
嘉年华活动新闻稿
2015/07/17 职场文书
职场干货:简历中的自我评价应该这样写!
2019/05/06 职场文书
动画「进击的巨人」第86话播出感谢绘公开
2022/03/21 日漫