jquery表单可编辑状态

最新推荐文章于 2025-04-09 09:50:02 发布

原创最新推荐文章于 2025-04-09 09:50:02 发布 · 593 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#jquery #表单 #javascript

收录于

记录专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一个使用JavaScript实现的表格编辑功能。当用户选择特定行后，原本显示为文本的内容将变为可编辑的输入框，实现了从只读到可编辑状态的转换。此功能通过检查复选框状态并相应地更改表格单元格内容来实现。

/*==================js代码====================*/

$('input[name="Fruit"]:checked').each(function(){
$(this).parent().siblings("td").each(function() { // 获取当前行的其他单元格
obj_text = $(this).find("input:text"); // 判断单元格下是否有文本框
if(!obj_text.length) // 如果没有文本框，则添加文本框使之可以编辑
$(this).html("<input type='text' value='"+$(this).text()+"'>");
else // 如果已经存在文本框，则将其显示为文本框修改的值
$(this).html(obj_text.val());
});
});

/*==================js代码====================*/

/*==================html代码====================*/

/*==================html代码====================*/