php 检测表格双击操作,PHP+jQuery实现双击修改table表格功能示例
本文实例讲述了PHP+jQuery实现双击修改table表格功能。分享给大家供大家参考,具体如下:
即点即改
$con = array(
array("id"=>1,"姓名"=>"张三","性别"=>"女"),
array("id"=>2,"姓名"=>"李四","性别"=>"男"),
array("id"=>3,"姓名"=>"王五","性别"=>"男"));
// print_r($con);die;
?>
<?php foreach ($con as $key => $v): ?>
type="text" disabled="disabled" readonly="readonly" value="= $v['姓名'];?>" >
type="text" disabled="disabled" readonly="readonly" value="= $v['性别'];?>" >
//双击触发事件
$("tbody>tr>td").dblclick(function(){
//获取到 当前 input 下的元素(原值)
window.olds = $(this).children('input').val();
if(olds==undefined)
{
return false;
}
var signs = $(this).attr('signs'); //获取属性值(这些值方便php后台的操作)
var user_id = $(this).parent().attr("id"); //接受当前点击的ID(tr里的id)
//双击之后可以修改
$(this).find('input').attr("disabled",false);
$(this).find('input').attr("readonly",false);
$(this).find('input').css("border",'1px solid deepskyblue');
$(this).find('input').attr('id', signs + "_" + user_id); //方便下面失去焦点事件 找ID(没有这个无法定位到tr里面的id属性)
//循环这些值从而判断是修改数据的类型,对一些特殊类型的数据进行特殊处理
switch(signs){
case 'user_name':
$("#" + signs + "_" + user_id).focus().on("blur",function(){
var content = $(this).val();
if(content!=olds) //与原值不同则传到后台
{
// alert(user_id);alert(signs);alert(content);
/*
通过getJSON将数据传输到后台
USER_ID
SIGNS
CONTENT
*/
}
$(this).attr('disabled', 'disabled');
$(this).attr('readonly', 'readonly');
$(this).css('border', '0');
$(this).css('background', '#fff');
$(this).css('text-align', 'center');
})
break;
case 'user_sex':
$("#" + signs + "_" + user_id).focus().on("blur",function(){
var content = $(this).val();
if(content!=olds)
{
// alert(user_id);
}
$(this).attr('disabled', 'disabled');
$(this).attr('readonly', 'readonly');
$(this).css('border', '0');
$(this).css('background', '#fff');
$(this).css('text-align', 'center');
})
}
})
运行效果如下:
希望本文所述对大家PHP程序设计有所帮助。
php 检测表格双击操作,PHP+jQuery实现双击修改table表格功能示例相关推荐
- html table 转置,jQuery+CSS实现的table表格行列转置功能示例
本文实例讲述了jQuery+CSS实现的table表格行列转置功能.分享给大家供大家参考,具体如下: 先来看看运行效果: 具体代码如下: www.ddpool.cn jQuery行列转置 table ...
- html表格td向下排序,jquery实现的table排序功能示例
本文实例讲述了jquery实现的table排序功能.分享给大家供大家参考,具体如下: Document div { width: 1024px; margin: 0 auto; /*div相对屏幕左右 ...
- iden中html中表格自动生成,JS实现动态生成html table表格的方法分析
本文实例讲述了JS实现动态生成html table表格的方法.分享给大家供大家参考,具体如下: 刚在论坛上面逛的时候看到有人问html表格怎么动态生成,我回了一下发现有好多小伙伴追问- - 看来还是有 ...
- html表格线条颜色怎么改变颜色,网页中table表格如何修改边框颜色
table表格是网页制作中以前较常使用的一种布局方式,但随着DIV+CSS的兴起,table表格已辉煌不在.但它在我们制作网页中也是时有用到.table表格也可以使用DIV一样随意的设置它的边框颜色. ...
- bootstrapr表格父子框_JS组件系列之Bootstrap table表格组件神器【二、父子表和行列调序】...
Bootstrap Table是轻量级的和功能丰富的以表格的形式显示的数据,支持单选,复选框,排序,分页,显示/隐藏列,固定标题滚动表,响应式设计,Ajax加载JSON数据,点击排序的列,卡片视图等. ...
- Antd修改Table表格行间距
我们在使用Antd的table表格时,可能需要增大每行间距.如果直接在tr或td标签中使用margin或padding不会生效.像下图我把margin-top设置了1000px,页面明显可以看出没生效 ...
- java实现歌词滚动,jQuery实现的简单歌词滚动功能示例
本文实例讲述了jQuery实现的简单歌词滚动功能.分享给大家供大家参考,具体如下: jquery实现歌词滚动 1.css /* CSS Document */ * { margin: 0; paddi ...
- html调整表格位置上下左右,利用jquery实现在html的表格中使用上下左右键切换单元格,同时只限制单元格输入数字...
因其他无关代码比较多,只贴关键代码,请谅解. 解释:tblGrid是表格的id , onchange是每个单元格都拥有的方法,当然可以根据实际情况更改flag是标志位,保证按照我想要的顺序新增tabi ...
- php表格生成器代码,PHP使用For循环生成table表格
时间:2019-04-20 概述:循环 函数 本代码主要是一个PHp函数的声明示例,侧重于PHP命名规则的相关说明,用PHP的For循环来生成一个Table,这个代码相对简单,面向PHP新手吧: ta ...
最新文章
- WPF的ListBox中的RadioButton不能单选问题
- UVa11022 String Factoring(kmp+dp)
- 十三五乐山全力推进智慧城市和新能源汽车等项目
- 如何优雅的分析 Redis 里存了啥?
- 设计模式(4)--AbstractFactory(抽象工厂模式)--创建型
- ZJOI2007 棋盘制作
- C# EF 与 MySql 的那些坑
- python入门自学软件手机版_python编程入门
- VR电竞游戏在英特尔®架构上的用户体验优化
- 个子矮s弯如何看点打方向图解_科目二s弯怎么看点打方向技巧图解
- 【概率论】范畴分布 Categorical / Multinoulli Distribution
- 未能找到路径中的某个部分_未找到路径XXX的一部分,处理方式
- 莱赞多店管家分析Lazada印尼站点热卖商品,商家运营更轻松
- 英国小黄车玩法,国际版抖音tiktok小店
- C语言 程序 素数圈圈
- html图片菱形,CSS3 菱形拼图实现只旋转div 背景图片不旋转功能
- SqlDataReader转换为DataTable
- Python小项目——生成个性二维码
- “政务上链” 能否解决新数据孤岛、安全风险等问题
- springboot logback日志问题