点击按钮文字变成input框，点击保存变成文字
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta charset="utf-8">
<title>点击按钮文字变成input框，点击保存变成文字</title>
<style type="text/css">
table{ text-align: center; font-size: 14px;}
table>thead>tr>th{ font-weight: normal;}
.text-right{ padding-right:73px; text-align: right;}
.text{ width: 50px; height: 30px; border: 1px solid #ddd; text-align: center;}
</style>
<script type="text/javascript" src="js/jquery.min.js"></script>
</head>
<body>
<table>
<thead>
<tr>
<th width="400">品名</th>
<th width="200">件数</th>
</tr>
</thead>
<tbody>
<tr height="50">
<td>iPhone6s</td>
<td class="edit">2</td>
</tr>
<tr height="50">
<td>小米5</td>
<td class="edit">5</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2" class="text-right">
<button type="button" class="btn" onclick="change(this)">修改</button>
</td>
</tr>
</tfoot>
</table>
<script type="text/javascript">
function change(obj){
var xg=$(obj).html();
if(xg=='修改'){
$('.edit').each(function(){
var old=$(this).html();
$(this).html("<input type='text' name='editname' class='text' value="+old+" >");
})
$(obj).html('保存');
}else if(xg=='保存'){
$('input[name=editname]').each(function(){
var old=$(this).html();
var newfont=$(this).parent('td').parent('tr').children().find('input').val();
$(this).parent('td').html(newfont);
})
$(obj).html('修改');
}
}
</script>
</body>
</html>
转载请带上原作者，谢谢合作！！！
点击按钮文字变成input框，点击保存变成文字的更多相关文章
- 请写出一段JavaScript代码，要求页面有一个按钮，点击按钮弹出确认框。程序可以判断出用
请写出一段JavaScript代码,要求页面有一个按钮,点击按钮弹出确认框.程序可以判断出用 户点击的是“确认”还是“取消”. 解答: <HTML> <HEAD> <TI ...
- js实现点击按钮时显示弹框，点击按钮及弹框以外的区域时隐藏弹框
转自https://blog.csdn.net/yimawujiang/article/details/86496936 问题:js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框? 方案一 ...
- div悬浮在屏幕的中间及点击按钮关闭弹出框
#fd { position: fixed; z-index: 999; width: 109px; height: 323px; top: 71%; right: 1%; margin: -50px ...
- 点击按钮显示隐藏DIV，点击DIV外面隐藏DIV
点击按钮显示隐藏DIV,点击DIV外面隐藏DIV 注意:此方法对touch事件不行,因为stopPropagation并不能阻止touchend的冒泡 <style type="tex ...
- 常见问题1：默认div隐藏，点击按钮时出现，再点击时隐藏。
例:默认div隐藏,点击按钮时出现,再点击时隐藏. <a href="#" onclick="f('ycbc')"; >控制按钮</a> ...
- 清除input框对浏览器保存的用户名和密码自动填充问题
清除input框对浏览器保存的用户名和密码自动填充问题: type类型写如下写法,聚焦的时候type类型为“password” <input ng-model="getpwd" ...
- jquery实现点击按钮弹出层和点击空白处隐藏层
昨天做项目遇到一个问题,和大家分享下,jquery实现点击按钮弹出层和点击空白处隐藏层的问题 if($('.autoBtn').length){ $('.autoBtn' ...
- Net实现钩子函数(Hook)以及通过SendMessage实现自动点击按钮和给文本框赋值
1.实现钩子函数 钩子(Hook)的实现需要三个主要的函数和一个委托 [DllImport("user32.dll", CharSet = CharSet.Auto, Callin ...
- angular input框点击别处 变成不可输入状态
<input type="text" ng-model="edit" ng-disabled="!editable" focus-me ...
随机推荐
- 找回丢失的SQL Server性能计数器
There was one time when I was delivering a Service using a tool that gathers performance data throug ...
- Java算法试题--猜字母/杀人游戏
题目例如以下: 把abcd-s共19个字母组成的序列反复拼接106次,得到长度为2014的串. 接下来删除第1个字母(即开头的字母a).以及第3个,第5个等全部奇数位置的字母. 得到的新串再进行删除奇 ...
- 重启PHP命令
php-fpm重启 killall php-fpm 再执行(usr/local/php是php的安装目录)/usr/local/php/sbin/php-fpm & /usr/local/ng ...
- linux 参数优化
脏页 vm.dirty_background_radio=10 (当脏页占内存10%,pdflush工作) vm.dirty_radio=40 (当进程自身脏页占内存40%,进程自己处理脏页,将其写入 ...
- mysql performance schema的即时诊断工具-邱伟胜
https://github.com/noodba http://www.noodba.com
- JavaScript网站设计实践（四）编写about.html页面，利用JavaScript和DOM，选择性的显示和隐藏DIV元素
一.现在我们在网站设计(三)的基础上,来编写about.html页面. 这个页面要用到的知识点是利用JavaScript和DOM实现选择性地显示和隐藏某些DIV about.html页面在前面我们为了 ...
- signal函数、sigaction函数及信号集(sigemptyset,sigaddset)操作函数
信号是与一定的进程相联系的.也就是说,一个进程可以决定在进程中对哪些信号进行什 么样的处理.例如,一个进程可以忽略某些信号而只处理其他一些信号:另外,一个进程还可以选择如何处理信号.总之,这些总与特定 ...
- tcl/tk
http://blog.csdn.net/dulixin/article/category/365058 http://blog.csdn.net/dulixin/article/category/3 ...
- 用Cookie记住上次登录用户名
一个登录页面设置查看Cookie中的数据(Cookie不为null);然后将页面提交到另一个页面去,在这个页面中的到是否选择记住用户名,如果选择了, 就创建Cookie对象,将用户名存储起来,下次登录 ...
- 几个linux命令
常用linux命令: 普通用户命令: 一.文件和目录查看类命令 1. ls (常用参数 -l 和-h) 蓝颜色:表示目录 绿颜色:表示可执行文件 红颜色:表示压缩文件 白颜色:表示普通文件 青色:表示 ...