文章摘要
这篇文章描述了一段在页面加载时自动处理td元素点击事件的JavaScript代码。在页面加载时,代码通过`$(document).ready(function () {)`绑定到所有td元素,并调用`tdclick`函数。`tdclick`函数的主要操作包括:1)保存当前td元素的文本内容;2)清空td元素的内容;3)创建一个文本框并设置其值为保存的内容;4)处理回车键事件(`input.keyup`)时,将文本重新填充到td元素,并触发td元素的点击事件。此外,代码还通过`td.append(input)`将文本框添加到td元素,并通过`td.unbind("click")`移除td元素原有的点击事件,以避免重复处理。
//在页面装载的时候进行对td的点击
$(document).ready(function () {
var tds=$(“td”);
tds.click(tdclick);
});
function tdclick() {
//1将文本的内容保存起来
var td=$(this);
var text=td.text();
//2清空td里面的内容
td.html(“”);
//3建立文本框
var input=$(“<input>”);
//4.设置文本框的值是保存起来的值
input.attr(“value”, text);
//4.5相应回车和键盘事件
input.keyup(function (event) {
//判断按键是什么
var myevent=event || window.event;
var key=myevent.keyCode;
if (key==13) {
var inputnode=$(this);
//1.保存文本框的内荣
var inputtext=inputnode.val();
//2.清空td里面的内容保存的文本框填充到td中去
var tdNode=inputnode.parent();
tdNode.html(inputtext);
//4.让td重新拥有点击事件
td.click(tdclick);
}
});
//5将文本框加入到td中
td.append(input);
//6为了防止td的点击事件,我们可以移除
td.unbind(“click”);
}
//在页面装载的时候进行对td的点击
$(document).ready(function () {
var tds=$(“td”);
tds.click(tdclick);
});
function tdclick() {
//1将文本的内容保存起来
var td=$(this);
var text=td.text();
//2清空td里面的内容
td.html(“”);
//3建立文本框
var input=$(“<input>”);
//4.设置文本框的值是保存起来的值
input.attr(“value”, text);
//4.5相应回车和键盘事件
input.keyup(function (event) {
//判断按键是什么
var myevent=event || window.event;
var key=myevent.keyCode;
if (key==13) {
var inputnode=$(this);
//1.保存文本框的内荣
var inputtext=inputnode.val();
//2.清空td里面的内容保存的文本框填充到td中去
var tdNode=inputnode.parent();
tdNode.html(inputtext);
//4.让td重新拥有点击事件
td.click(tdclick);
}
});
//5将文本框加入到td中
td.append(input);
//6为了防止td的点击事件,我们可以移除
td.unbind(“click”);
}
© 版权声明
文章版权归作者所有,未经允许请勿转载。