jQuery实现鼠标双击Table单元格变成文本框及输入内容后更新到数据库的方法_jquery

本文实例讲述了jQuery实现鼠标双击Table单元格变成文本框及输入内容后更新到数据库的方法。分享给大家供大家参考,具体如下:

JS鼠标双击事件 onDblClick

<td width="10%" title="双击修改" ondblclick="ShowElement(this,<%#Eval("id") %>
</td>

这里的本人用绑定的值是传的当前行对应的ID号

function ShowElement(element, productid, flag, ishotorcommend) {
  if (flag == 0 && ishotorcommend == 0) {
    alert("请先设置该产品为推荐");
    return;
  }
  if (flag == 1 && ishotorcommend == 0) {
    alert("请先设置该产品为热销");
    return;
  }
  var oldhtml = element.innerHTML;//原单元格里的值
  var str = "<input type='text' name='test' style='width:50%;'";
  str += "onkeypress='return event.keyCode>=48&&event.keyCode<=57||event.keyCode==46'";
  str += "onpaste='return !clipboardData.getData('text').match(/\D/)'";
  str += "ondragenter='return false' />";
  var newobj = document.createElement(str);  //创建新的input元素
  newobj.setAttribute("value", oldhtml);//把原来单元格中的值赋给文本框
  newobj.onblur = function() {
    element.innerHTML = this.value ? this.value : oldhtml; //当触发时判断新增元素值是否为空,为空则不修改,并返回原有值
    var sort = element.innerHTML;
    $.get("UpdateFlag.ashx?sort=" + sort + "&&productid=" + productid + "&&flag=" + flag, function(data) { });
  }
  element.innerHTML = '';
  element.appendChild(newobj);//把新的值赋到单元格
  newobj.focus();
}

希望本文所述对大家jQuery程序设计有所帮助。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索jquery
, 文本框
, 鼠标双击
, Table单元格
更新到数据库
文本框显示数据库数据、java文本框显示数据库、php文本框显示数据库、数据库access 文本框、java 数据库 文本框,以便于您获取更多的相关知识。

时间: 2024-10-29 13:51:49

jQuery实现鼠标双击Table单元格变成文本框及输入内容后更新到数据库的方法_jquery的相关文章

定位 光标-如何使用javascript使用方向键控制光标在table单元格的文本框(是TextBox控件)中跳动

问题描述 如何使用javascript使用方向键控制光标在table单元格的文本框(是TextBox控件)中跳动 最近在做一个仓库管理系统,客户说最好能用方向键来定位光标,不需要用鼠标点击,这样必须麻烦,我在table单元格中放了文本框(TextBox控件),如何用方向键来定位,谢谢大家啦...

DataGridView怎么实现单元格是文本框和按钮组合

问题描述 1.需要做一个DataGridView控件,个别单元格是文本框和按钮组合,单元格右边是个按钮,点击按钮弹出一个对话框,如图:2.在单元格中绘制按钮,比较简单,但是当界面最大化或者改变列宽时,按钮位置没有移动,目的是让按钮出现在设置数据的最右边,如图:希望大神指点,感激不尽! 解决方案 解决方案二:肯定是绘制方法有问题了,看看这些行不行.http://blog.csdn.net/heku518/article/details/3239135http://www.cnblogs.com/p

Jquery实现 TextArea 文本框根据输入内容自动适应高度

原文 Jquery实现 TextArea 文本框根据输入内容自动适应高度 在玩微博的时候我们可能会注意到一个细节就是不管是新浪微博还是腾讯微博在转发和评论的时候给你的默认文本框的高度都不会很高,这可能是版面的限制和用户通常只转播或者评论一个短句有关.但是当你输入超过一行文字的时候,TextArea自动适应高度,大大改善了体验,这样用户就可以看到全部的文字.不用再去拖动文本框的滚动条.   如下图:   这些在平时的项目中挺实用的,所以抽空封装了一个文本框根据输入内容自适应高度的插件 - Text

双击编辑单元格的值[DataGrid - WebFrom]

datagrid|web|单元格 思路: 在控件创建时为每个单元格添加双击事件,并标上单元格的行号与列号. 鼠标双击某个单元格时,该单元格的行号与列号做为参数传回服务器. DataGrid重新绑定时修改对象单元格的值. 已知问题:当单元格内容带有单引号(')时,内容将会别截断.但是后来输入的不会有这种情况. 那位高人知道怎么解决的话,请一定告诉我.E-mail:czhenq@163.com .Aspx文件中添加 //返回行号.列号 function Dg_dbClick(RowID,Column

鼠标-jQuery实现类似excel一样拖动选择table单元格进行合并,如何实现?

问题描述 jQuery实现类似excel一样拖动选择table单元格进行合并,如何实现? 在任意单元格,按下鼠标后,可以选中多个行和多个列,松开鼠标后,这些单元格的背景色变化(就像是Excel拖动单元格选择似的那种) 将拖动选中的单元格进行合并 现在可以选中合并了,但我要的是点击右键菜单 合并单元格 然而 选中之后 点击右键,选中的单元格就没有了 只剩右键点击的那一个单元格.有什么解决方法吗??? 解决方案 可以试试bootstrap插件,不知道行不行 解决方案二: 这些可以实现,就用mouse

jQuery实现点击表格单元格就可以编辑内容的方法【测试可用】_jquery

本文实例讲述了jQuery实现点击表格单元格就可以编辑内容的方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/

如何判断鼠标单击的单元格相对于单元格所在行的索引值

如何判断鼠标单击的单元格相对于单元格所在行的索引值 解决思路:        利用单元格的cellIndex属性即可实现 具体步骤: 代码示例: <table width="200" height="30" border="1">   <tr>     <td onClick="alert(this.cellIndex)">demo</td>     <td onClick

如何使鼠标单击ITEM单元格时黑色选中色变为其他颜色?(原创)

单元格|选中|原创 如何使鼠标单击ITEM单元格时黑色选中色变为其他颜色? 问题描述: 如何使鼠标单击ITEM单元格(TAB ORDER为0)时黑色选中色变为其他颜色? 解决方案: 1.首先将DW属性中的COLUMN MOVING 和MOUSE SELECTION两项取消选中: 2.在DW的CLICKED事件中写代码: //此处声明所用到的相关变量:  long  ll_curcol,ll_pos,ll_cols  string  ls_modstring,ls_colname,ls_color

Excel单元格内文本换行方法

使用Excel编辑工作表时,如果希望文本在单元格内以多行显示,可以有几种方法. 一.设置单元格格式 选择所需的单元格区域,在"开始"选项卡上的"对齐"组中,单击"自动换行".此时,单元格中的数据会自动换行以适应列宽.当更改列宽时,数据换行会自动调整.如果所有换行文本均不可见,则可能是该行被设置为特定高度,请调整行高. 二.快捷键换行 另外,你也可以在单元格中的特定位置开始新的文本行,方法是:双击该单元格,单击该单元格中要断行的位置,然后按&quo