JS实现即点即编辑功能代码_javascript技巧

效果如图所示：

分享代码喽：

<title></title> <script language="JavaScript">　 <!-- var globalLineId_1 = 1; var endLineId_1 = 5; var globalLineId_2 = 1; var endLineId_2 = 5; var globalLineId_3 = 1; var endLineId_3 = 5; var currTab = 1; function switchShow(isWrite,lineId, tabId){ var inputText = document.getElementById("inputText_"+tabId+"_"+lineId); var inputDiv = document.getElementById("inputDiv_"+tabId+"_"+lineId); var inputContentDiv = document.getElementById("inputContentDiv_"+tabId+"_"+lineId); var inputContent = document.getElementById("inputContent"); var inputTd = document.getElementById("inputTd_"+tabId+"_"+lineId); eval("globalLineId_"+tabId+"=lineId"); currTab = tabId; if (isWrite){ inputText.value=inputDiv.innerText inputDiv.style.display="none"; inputText.style.display="block"; inputContent.innerText = inputContentDiv.innerText; inputText.focus(); if (eval("globalLineId_"+tabId) == eval("endLineId_"+tabId)){ addNewRow(); } }else{ inputDiv.innerText=inputText.value; inputDiv.style.display="block"; inputText.style.display="none"; } } function addNewRow(){ eval("endLineId_"+currTab+"++"); var currEndLineId = eval("endLineId_"+currTab); var inputTab = document.getElementById("inputTab_" + currTab); var newTr = inputTab.insertRow(); var newTd = newTr.insertCell(); newTd.id = "inputTd_"+currTab+"_"+currEndLineId; newTd.style.height = "22px"; newTd.style.borderBottom = "solid 1px #000"; newTd.innerHTML = "<div id='inputDiv_"+currTab+"_"+currEndLineId+"' style='padding-left:3px;'> </script>

" + "" + "

"; newTd.onclick = Function("switchShow(true, "+currEndLineId+", "+currTab+")"); } function saveContent(){ var inputContentDiv = document.getElementById("inputContentDiv_"+currTab+"_"+eval("globalLineId_"+currTab)); var inputContent = document.getElementById("inputContent"); if(inputContentDiv !=null){ inputContentinputContentDiv.innerText = inputContent.innerText; } } function deleteItem(){ var inputTd = document.getElementById("inputTd_"+currTab+"_"+eval("globalLineId_"+currTab)); var inputTab = document.getElementById("inputTab_"+currTab); var inputRows = inputTab.rows; var inputCells ; var rowsLength = inputRows.length; if (inputTd!=null){ for(i=1; i 　

配置预算项目 教育学费 大学学位已成为社会工作的基本门槛，也成为父母提供子女的基本，子女教育具有不具时间弹性和费用弹性，不象住房规划和退休规划，如财礼不足，可以减低标准，子女教育的时间点和费用比较固定，需要及早规划。 住宿费 住宿费项目说明。 生活费 生活费项目说明。 其他 其他项目说明。 配置适用地区 西北地区 配置适用地区，西北地区，项目说明。 福建省 配置适用地区，福建省，项目说明。 北京市 配置适用地区，北京市，项目说明。 配置预算方案 低成本预算方案 配置预算方案，低成本预算方案，项目说明。 普通预算方案 配置预算方案，普通预算方案，项目说明。 豪华预算方案 配置预算方案，豪华预算方案，项目说明。

大学学位已成为社会工作的基本门槛，也成为父母提供子女的基本，子女教育具有不具时间弹性和费用弹性，不象住房规划和退休规划，如财礼不足，可以减低标准，子女教育的时间点和费用比较固定，需要及早规划。

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]