tp5修改(实现即点即改)
时间:2022-07-27
本文章向大家介绍tp5修改(实现即点即改),主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
效果如下所示:
点击修改时把想修改的变成input框
实现代码如下:根据自己实际情况修改即可。
<script type="text/javascript"
$(document).on('click','.xiu',function(){
old_val=$(this).html();
// $(this).parent().html("<input type='text' value="+old_val+" class='input' ");
old_text = $('.text').html();
var obj=$(this).parent().parent();
var id=obj.attr('qid');//id
var name=obj.find('.name').html();//姓名
var img=obj.find('.img').val();//照片
var age=obj.find('.age').html();//年龄
var num=obj.find('.num').html();//球队
var text=obj.find('.text').html();//简介
obj.find('.name').html('<input type="text" value="'+name+'" ')
// obj.find('.img').html('<input type="file" value="'+img+'" ')
obj.find('.age').html('<input type="text" value="'+age+'" ')
obj.find('.num').html('<input type="text" value="'+num+'" ')
obj.find('.text').html('<input type="text" value="'+text+'" ')
$(this).attr('class','gai');
$(this).html('保存');
// var val=$(this).val(); //获取修改后的值
// $.ajax({
// type:'post',
// url:"{:URL('/index/backstage/update')}",
// data:{
// id:id,
// val:val
// },
// dataType:"json",
// success:function(msg){
// // alert(msg)
// if(msg == 1){
// obj.parent().html("<span class='name' "+val+"</span ")
// }else{
// obj.parent().html("<span class='name' "+old_val+"</span ")
// }
// }
// })
})
$(document).on('click','.gai',function(){
var obj=$(this).parent().parent();
var id=obj.attr('qid'); //获取要修改内容的id
var name=obj.find('.name').children().val();//姓名
var age=obj.find('.age').children().val();//年龄
var num=obj.find('.num').children().val();//球队
var text=obj.find('.text').children().val();//简介
// alert(name+age+num+text)
$.ajax({
type:'post',
url:"{:url('backstage/update')}",
data:{
id:id,
name:name,
age:age,
num:num,
text:text,
},
success:function(e){
obj.find('.name').html(name)
obj.find('.age').html(age)
obj.find('.num').html(num)
obj.find('.text').html(text)
}
})
$(this).attr('class','xiu');
$(this).html('修改');
})
</script
控制器里写:
//修改
public function update()
{
// echo 1111;die;
$id=$_POST['id'];
$data=$_POST;
// $name=$_POST['name'];
// $age=$_POST['age'];
// $num=$_POST['num'];
// $text=$_POST['text'];
$res=Db('qname')- where('id', $id)- update($data);
if ($res) {
echo "11111";
}
}
以上这篇tp5修改(实现即点即改)就是小编分享给大家的全部内容了,希望能给大家一个参考。
- A+B for Input-Output Practice (VI)
- 前后端分离跨服务器文件上传-Java SpringMVC版
- 数组和链表的区别
- 《快学Scala》第一章 基础
- 二分查找法的实现和应用汇总
- 《快学Scala》第一章 基础
- 移动端打印输出内容以及网络请求-vconsole.js
- 二分查找法的实现和应用汇总
- JavaScript前端和Java后端的AES加密和解密
- 《Spark MLlib 机器学习实战》1——读后总结
- angularjs自定义指令实现分页插件
- A+B for Input-Output Practice (V)
- 机器学习——相似度算法汇总
- 白话推荐系统——从原理到实践,还有福利赠送!
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 给你点信心——LeetCode题目7:整数反转
- Python -二叉树 创建与遍历算法(很详细,转自国外教程)
- APP流量来源追踪方式——Android篇
- 从浏览器输入网址回车到看到页面过程到底经历了什么?
- Flutter Bloc 官方文档(BlocBuilder翻译)
- OpenGL ES 3.0 | 统一变量和属性的概念与(在程序中的)获取流程、统一变量缓冲区对象详解、std140块规范、用 命名统一变量块 建立 统一变量缓冲区对象 的流程 和 相关API 和...
- 深入浅出SVM(PART III)
- 高频原题——LeetCode题目8:字符串转换整数 (atoi)
- 不转字符串判断——LeetCode题目9:回文数
- 关于双指针的简单理解
- 面试题噩梦之一——LeetCode题目10:正则表达式匹配
- 什么时候触发GC
- 找找数学上的规律——LeetCode题目11:盛最多水的容器
- Java学习笔记, 不断更新
- 这题真是送分——LeetCode题目12:整数转罗马数字