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实现的使用方向键控制光标在table单元格中切换
Nov 17 Javascript
Yii-自定义删除确认弹框(zyd)jquery实现代码
Mar 04 Javascript
自动设置iframe大小的jQuery代码
Sep 11 Javascript
jQuery 滑动方法slideDown向下滑动元素
Jan 16 Javascript
使用JavaScript链式编程实现模拟Jquery函数
Dec 21 Javascript
AngularJS仿苹果滑屏删除控件
Jan 18 Javascript
js实现表单及时验证功能 用户信息立即验证
Sep 13 Javascript
js实现将json数组显示前台table中
Jan 10 Javascript
一步步教你利用webpack如何搭一个vue脚手架(超详细讲解和注释)
Jan 08 Javascript
使用vue-cli(vue脚手架)快速搭建项目的方法
May 21 Javascript
详解vuex之store拆分即多模块状态管理(modules)篇
Nov 13 Javascript
微信小程序下拉框搜索功能的实现方法
Jul 31 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
drupal 代码实现URL重写
2011/05/04 PHP
一个显示某段时间内每个月的方法 返回由这些月份组成的数组
2012/05/16 PHP
PHP执行批量mysql语句的解决方法
2013/05/02 PHP
分享50个提高PHP执行效率的技巧
2015/12/26 PHP
PHP PDOStatement::bindValue讲解
2019/01/30 PHP
JavaScript使用prototype定义对象类型(转)[
2006/12/22 Javascript
JavaScript中使用arguments获得函数传参个数实例
2014/08/27 Javascript
js点击列表文字对应该行显示背景颜色的实现代码
2015/08/05 Javascript
jQuery替换节点用法示例(使用replaceWith方法)
2016/09/08 Javascript
JS经典正则表达式笔试题汇总
2016/12/15 Javascript
Nodejs+Socket.io实现通讯实例代码
2017/02/13 NodeJs
bootstrap警告框示例代码分享
2017/05/17 Javascript
通过命令行创建vue项目的方法
2017/07/20 Javascript
Vue shopCart 组件开发详解
2018/01/26 Javascript
详解Angular路由之路由守卫
2018/05/10 Javascript
详解webpack打包时排除其中一个css、js文件或单独打包一个css、js文件(两种方法)
2018/10/26 Javascript
JS几个常用的函数和对象定义与用法示例
2020/01/15 Javascript
JavaScript中while循环的基础使用教程
2020/08/11 Javascript
基于jQuery拖拽事件的封装
2020/11/29 jQuery
Python 提取dict转换为xml/json/table并输出的实现代码
2016/08/28 Python
Python  pip安装lxml出错的问题解决办法
2017/02/10 Python
JPype实现在python中调用JAVA的实例
2017/07/19 Python
Python解析json代码实例解析
2019/11/25 Python
Django跨域请求原理及实现代码
2020/11/14 Python
如何使用python-opencv批量生成带噪点噪线的数字验证码
2020/12/21 Python
详解CSS3 filter:drop-shadow滤镜与box-shadow区别与应用
2020/08/24 HTML / CSS
亚马逊印度站:Amazon.in
2017/10/15 全球购物
马来西亚网上美容店:Hermo.my
2017/11/25 全球购物
Rodd & Gunn澳大利亚官网:新西兰男装品牌
2018/09/25 全球购物
如何启动时不需输入用户名与密码
2014/05/09 面试题
介绍一下Ruby中的对象,属性和方法
2012/07/11 面试题
小学生家长评语大全
2014/02/10 职场文书
《可爱的动物》教学反思
2014/02/22 职场文书
销售内勤岗位职责范本
2015/04/13 职场文书
信息技术远程培训心得体会
2016/01/09 职场文书
世界文化遗产导游词
2019/08/07 职场文书