<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>新建网页 1</title>
</head>
<body>
<form name="f1" method="post" action="XXX">
<table border="1" width="500">
<tr>
<td width="20%">这是主键</td>
<td width="40%">名字</td>
<td width="40%">编号</td>
</tr>
<tr>
<td><input type="hidden" name="ids" value="1">1</td>
<td onDblClick="show(this,'0','打酱油');"><input type="hidden" name="names" value="打酱油">打酱油</td>
<td onDblClick="show(this,'1','9527');"><input type="hidden" name="codes" value="9527">9527</td>
</tr>
<tr>
<td><input type="hidden" name="ids" value="2">2</td>
<td onDblClick="show(this,'0','俯卧撑');"><input type="hidden" name="names" value="俯卧撑">俯卧撑</td>
<td onDblClick="show(this,'1','9528');"><input type="hidden" name="codes" value="9528">9528</td>
</tr>
</table>
<input type="submit">
</form>
<script>
function show(obj,id,valu){
if(id == "0"){
obj.innerHTML = "<input type='text' name='names' value='"+ valu +"'>";
}else if(id == "1"){
obj.innerHTML = "<input type='text' name='codes' value='"+ valu +"'>";
}
}
</script>
</body></html>
相关推荐
在Bootstrap中，表格（Table）是常见的数据展示组件，而“bootstrap插件_table可编辑表格_demo”则是Bootstrap表格功能的一个扩展，它允许用户直接在表格内进行编辑，提供了更加交互式的用户体验。 Bootstrap表格的...
首先，我们关注"可编辑的表格"这一主题。在传统的HTML表格中，数据是静态的，用户只能浏览而无法直接编辑。但借助JavaScript，我们可以为表格单元格（`<td>`）添加事件监听器，如`click`或`focus`，以便当用户点击或...
要实现表格可编辑，我们主要关注`<td>`元素。 在jQuery中，我们可以利用`.click()`事件监听用户对表格单元格的点击。当用户点击某个单元格时，我们将该单元格的内容变为可编辑的输入框（`<input>`）。以下是一个...
1. **编辑单元格文本**：用户可以点击表格中的某个单元格，直接进行文本输入，修改后保存，更新表格数据。这种编辑方式简单直观，适合于字符串类型的数据。 2. **日期类型**：对于日期数据，表格会提供一个日期选择...
"jquery可编辑表格插件"就是基于jQuery的一种工具，旨在为网页中的表格提供动态编辑功能，使得用户可以直接在表格中进行数据的增删改查，极大地提升了交互性和用户体验。这种插件在数据展示和管理场景中尤其实用，...
为了实现可编辑功能，我们需要对这些元素添加额外的JavaScript事件监听器，如`click`或`focus`，以便在用户点击单元格时使其变为可编辑状态。 JavaScript作为客户端脚本语言，在网页交互中起着至关重要的作用。在这...
当用户点击表格单元格时，可以触发编辑模式。 ```javascript document.querySelectorAll('td').forEach(td => { td.addEventListener('click', function() { this.contentEditable = 'true'; // 开启编辑模式 })...
本篇文章将深入探讨如何使用jQuery来实现一个可编辑的表格，这在数据展示和用户交互方面具有广泛的应用。 首先，让我们了解基本概念。jQuery的核心特性包括选择器（用于查找HTML元素）、DOM操作（添加、删除或修改...
当用户点击单元格时，单元格内的文本会变为可编辑的输入框；当用户离开单元格时，输入框消失，新的值会被显示出来。如果需要持久化数据，可以在`blur`事件中添加保存更改的逻辑，例如通过Ajax与服务器通信或使用Web ...
在JavaScript的世界里，创建一个可编辑的表格是一个常见的需求，特别是在构建动态Web应用程序时。这里我们探讨的主题是如何使用JavaScript（以及可能的库如jQuery或更专业化的数据网格库）来实现一个可编辑的表格...
这段代码会在用户点击表格单元格时，将单元格内容替换为文本输入框，并将焦点置于输入框。当输入框失去焦点（`blur`事件）时，会将新的值放回单元格，并移除输入框。 对于在表格后新增一行的需求，可以创建一个函数...
// 当点击表格单元格时，将其变为可编辑 $('#editableTable td').on('click', function() { $(this).replaceWith('$(this).text() + '">'); }); // 当离开单元格时，保存更改并恢复表格样式 $('body').on('...
标题 "EasyUI可扩展Editable DataGrid（可编辑数据表格）" 涉及的是一个流行的JavaScript框架——EasyUI中的一个特性。EasyUI是基于jQuery的一个轻量级且易于使用的前端框架，它提供了一系列预定义的CSS样式和...
在本文中，我们将详细解析如何使用Vue.js框架封装一个可编辑的表格插件。该插件允许用户在表格中进行单元格编辑，并能对表头进行任意合并，从而提供了强大的表格数据处理功能。 首先，我们需要了解该插件的基本结构...
在本案例中，"用js制作的可编辑表格"是一个使用JavaScript实现的用户可以直接在网页上编辑表格内容的功能。这种功能在数据管理、信息展示和表单填写等场景下非常实用，因为它提供了直观且便捷的数据输入方式。 首先...
- **单元格激活**：当用户点击表格单元格时，插件会激活该单元格，允许用户编辑其内容。 - **编辑模式**：通过CSS类切换，改变单元格的样式以表示其处于编辑状态。 - **数据保存**：当用户在单元格外点击时，插件会...
在网页开发中，数据展示通常会使用到表格（Table）这一元素，而让表格中的数据变得可编辑则能极大地提升用户体验。本项目“JQuery实现可编辑的表格”旨在教你如何利用JavaScript库JQuery实现这一功能。JQuery以其...
"可编辑的datagrid"指的是这种控件不仅能够展示数据，还允许用户直接在表格内进行编辑，提高了数据输入和管理的效率。 在Windows Forms、ASP.NET、WPF或JavaScript等开发环境中，都有相应的datagrid实现。例如，...
本文将深入探讨如何使用jQuery实现一个可编辑的表格，这将帮助开发者提高用户体验，允许用户直接在表格中修改数据。 首先，我们需要理解jQuery的核心特性：DOM操作、事件处理和动画效果。jQuery库简化了JavaScript...