最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

js修改table中Td的值(定义td的双击事件)_javascript技巧

来源:动视网 责编:小采 时间:2020-11-27 21:06:38
文档

js修改table中Td的值(定义td的双击事件)_javascript技巧

js修改table中Td的值(定义td的双击事件)_javascript技巧:客户需求至上。 这次是更改后的代码,去掉了确定,取消按钮。变单击为双击事件,用户按ESC键,取消更改。 代码如下: //为每个Td添加双击事件 function ReWritable() { var tbmian=document.getElementById(tbmain); /
推荐度:
导读js修改table中Td的值(定义td的双击事件)_javascript技巧:客户需求至上。 这次是更改后的代码,去掉了确定,取消按钮。变单击为双击事件,用户按ESC键,取消更改。 代码如下: //为每个Td添加双击事件 function ReWritable() { var tbmian=document.getElementById(tbmain); /


客户需求至上。
这次是更改后的代码,去掉了“确定”,“取消”按钮。变单击为双击事件,用户按ESC键,取消更改。
代码如下:
//为每个Td添加双击事件
function ReWritable()
{
var tbmian=document.getElementById("tbmain");
//循环,为每行每列添加双击事件,但是,第一行(thead)与最后一行(tfoot)不添加。
for(var i=1;i{
for(var j=0;j{
tbmain.rows[i].cells[j].ondblclick=TdDoubleClick;
}
}
}
//定义td的双击事件,为其添加文本框,使用用户可以输入。
function TdDoubleClick()
{
//首先判断是不是该方格已经存在文本框,如果存在,则返回,不重复添加文本框。如果不存在,则添加。
var tdcag=document.getElementById("tdcag");
var tdid=null;
var txtid=null;
var curtd=window.event.srcElement;
if(tdcag!=null)//已经存在,返回。
{
return;
}
//不存在,则添加
tdid=window.event.srcElement;
tdtxt=tdid.innerText;
tdtxt=Trim(tdtxt);
var str="";
str+="";
str+="";
tdid.innerHTML=str;
//使文本框获得焦点。
document.getElementById("txtId").focus();
var ctr=document.getElementById("txtId").createTextRange();
ctr.collapse(false);
ctr.select();
}
//去除字符串前后的空格。
function Trim(str)
{
return str.replace(/(^\s*)|(\s*$)/g, "");
}
//定义KeyPress按下时的事件,如果是ESC键,则取消更改,恢复为更改前的值。
document.onkeypress = function EscKeyPress()
{
if(event.keyCode==27)
{
CancelTdChanged();
return;
}
}
//取消更改,
function CancelTdChanged()
{
var tdInitValue=document.getElementById("tdInitValue");
var tdtxt=tdInitValue.value;
var tdid=document.getElementById("tdcag").parentNode;
tdid.innerText=Trim(tdtxt);
}
//确定更改,
function ChangeTdText()
{
var txtId=document.getElementById("txtId");
if(txtId==null)
{
return;
}
var tdid=document.getElementById("tdcag").parentNode;
tdid.innerText=Trim(txtId.value);
return;
}

其它代码,与以前相同。只是取消了对表的Thead与Tfoot的更改。
代码如下:



























thead,thead,thead

tfoot,tfoot,tfoot
11
12
13
21
22
23
31
32
33


文档

js修改table中Td的值(定义td的双击事件)_javascript技巧

js修改table中Td的值(定义td的双击事件)_javascript技巧:客户需求至上。 这次是更改后的代码,去掉了确定,取消按钮。变单击为双击事件,用户按ESC键,取消更改。 代码如下: //为每个Td添加双击事件 function ReWritable() { var tbmian=document.getElementById(tbmain); /
推荐度:
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top