<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>文本框可编辑查看页面</title>
<script type="text/javascript" src="js/jquery-1.7.2.min.js" ></script>
<style>
.form_ul li{margin-top: 5px; font-size: 14px;line-height: 30px;list-style-type:none;}
.form_ul input[disabled]{background: none; border:0;}
.Default_btn{padding:0 10px;height: 30px; min-width: 50px; line-height: 30px; text-align: center; background-color:#006AB6; font-size: 16px; display: inline-block; color: #fff; cursor: pointer; border:0;}
.Default_btn.close{background-color: #EEF7FE; color: #333; border:1px solid #CFE8FF;}
.btn_subimt .Default_btn{margin-right: 20px;}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('.edit_btn').click(function(){
$(".form_ul input").attr("disabled",false);
})
$('.submit_btn').click(function(){
$(".form_ul input").attr("disabled",true);
})
})
</script>
</head>
<body>
<ul class="form_ul">
<li>
<span>姓名：</span>
<input type="text" value="张三" name="name" disabled="disabled"/>
</li>
<li>
<span>电话：</span>
<input type="text" value="18192517955" name="phone" disabled="disabled"/>
</li>
<li>
<span>地址：</span>
<input type="text" value="人民路" name="phone" disabled="disabled"/>
</li>
</ul>
<div class="btn_subimt">
<input class="Default_btn close submit_btn" value="提交" type="submit">
<input class="Default_btn edit_btn" value="修改" type="submit">
</div>
</body>
</html>
u012081441
- 浏览: 15742 次
- 性别:
- 来自: 西安
-
最新评论
相关推荐
还有是初始数据全部可编辑，插入新行也是可编辑的，全部编辑形式是input框里直接编辑，失去焦点触发事件，非官方自带的编辑形式，将页面放到bootstrap-table的demo项目的insertRow.html同目录下即可
日期点击文本框允许用户通过点击文本框来选取或输入日期，它融合了日期选择器的便捷性与文本框的可编辑性。这种设计常见于各种应用程序，如在线表单、日程管理工具等，以方便用户输入或选择日期。 【描述】：在描述...
"使用Jquery实现点击文字后变成文本框且可修改"这一功能恰好满足了这样的需求，它允许用户通过简单的点击操作来编辑页面上的文本内容。这个功能常见于评论、笔记或者表单填写等场景，提升了用户体验。 首先，我们要...
本示例"在线编辑文本框.zip"提供了一个名为ueditor的演示项目，它是一个可运行的Dome，帮助开发者了解如何集成和自定义此类功能。 Ueditor是百度开发的一款强大的富文本编辑器，支持HTML编辑，并且可以上传图片，这...
在C#编程环境中，开发一个类似QQ的日记编辑文本框是一项常见的需求，它通常涉及到富文本编辑、表情支持、图片插入等功能。QQ的聊天界面以其直观、易用和丰富的功能著称，因此创建一个类似的控件能提升用户体验。在这...
“PPT素材”和“PPTX格式”表明这些文本框是可编辑的，用户可以直接在PPTX文件中进行调整，如改变颜色、大小、字体，甚至插入自己的图片和图表。这极大地提高了工作效率，让用户能够快速定制符合自己需求的PPT页面。...
通过使用文本框，用户可以在页面上的任意位置放置文字，并对其进行格式化操作。 ### 二、箭头装饰的文本框的作用 1. **增强视觉效果**：带有箭头装饰的文本框能够吸引观众的注意力，使演示文稿更加生动有趣。 2. *...
通过jQuery，我们可以根据需求改变标签的可编辑状态，例如设置`disabled`属性或移除事件监听器。 6. **禁用创建标签**： 当系统处于特定状态或用户无权限时，可能需要禁用创建新标签的功能。这可以通过监听文本框...
这个文件可能包含了如何将这些文本框整合到你的幻灯片设计中的模板，你可以直接编辑文字，替换为自己需要的内容。这种预设布局可以帮助你快速地创建出一致且专业的幻灯片，节省设计时间。 使用这些文本框素材时，有...
CKEditor是一款强大的富文本编辑器，它为文本框提供了丰富的功能和美化效果，常用于创建在线内容编辑界面。CKEditor不仅支持基本的文字输入，还包含了诸如插入图片、超链接、格式化文本、添加表格等高级特性，极大地...
标题所提到的“可编辑并且能够自动换行的div”，实际上是在讨论如何创建一个具有文本编辑功能的 `div` 元素，并且在用户输入文字时能自动换行，保持其形状不变。这涉及到 HTML、CSS 以及可能的 JavaScript 技术。 ...
在IT行业中，尤其是在前端开发领域，可拖拽图片并将其转化为文本框内可编辑的base64编码是一项实用的功能。这种技术通常用于提高用户体验，比如在聊天应用、论坛或者在线编辑器中，用户可以直接通过拖放操作上传图片...
TextView用于显示文本，而EditText则是TextView的可编辑版本，用户可以输入和修改文本。在登录界面中，通常会用到这两个控件，分别用于显示用户名和密码的输入框。 创建自定义文本框的第一步是创建一个新的类，继承...
"jwysiwyg"（Just What You See Is What You Get）就是这样一款仅17kb大小的文本框编辑器插件，它为开发者提供了丰富的功能，同时保持了极低的资源占用，使得在各种网页项目中集成变得简单快捷。 首先，让我们深入...
最近写一个这样的页面 要求点击修改按钮之后部分输入框由禁用状态变为可用状态.我使用了vue中的事件处理器,但是不知道怎么获取disabled这个属性的值,所以以失败告终.后来又使用了vue中的v-bind,使其与class...
【可编辑修改中国地图PPT模板】是一款专为制作演示文稿设计的工具，它具有以下关键知识点： 1. **PPT地图**：PPT地图是PowerPoint演示文稿中的一个重要元素，通常用于展示地理位置、区域划分或者数据分析。在这个...
立体效果则为文本框增添了三维感，使页面看起来更加生动和现代，能够吸引观众的视线，强化演示的主题表达。 描述中提到了“3d，立体，并列关系，PPT文本框，PowerPoint素材下载，.PPTX格式”。这表明这些素材是专为...
《InDesign CS4完全自学视频教程》第3章主要涵盖了文本框与文本编辑的核心操作，是初学者掌握专业排版软件InDesign不可或缺的部分。在这一章节中，你会深入了解到如何有效地管理和编辑文字，以实现高质量的版面设计...
当用户双击某个显示为文本的元素时，该元素会变为可编辑状态（通常表现为文本框），用户可以直接进行修改。 #### 二、技术实现原理 要实现上述功能，主要涉及以下几个关键技术点： 1. **事件监听**：通过`...