text值显示的问题,应该不难,接分了

层?是指DIV或SPAN标签吗? 加上ID 然后用调用JS来改边CSS DISPLAY:NONE; 这样吗?

var a=document.getElementById("f_name <%=k%>");
a.style.display="none";
a.parent.innerText=a.value;

外加一个层，点击后。在按钮上加onclick='divid.innerHTML=inputid.value'

<td> <input type="text" class="text" align="left" id="f_name <%=k%>" name="f_name <%=k%>" value=" <%=rs4.getString("f_name")%>" size="7" >
<label vaule="<%=rs4.getString("f_name")%>" hidden/>
</td>
click事件:
if input.style.hidden=true then
input.style.hidden=fasle
label.style.hidden=true
else
input.style.hidden=true
label.style.hidden=fasle
end if

这是样的么:http://www.millstream.com.au/upload/code/tablekit/
实现样式不难，关键是编辑后的数据实习的传到DB中,而且还要可以作撤消操作

个人觉得没有必要，用text即可1，只读状态下，设置text的class为无边框，底色与外层背景色一致，并将disabled属性设置为true2，编辑状态，只需要删除此class即可这样做比较简单部分代码：
function test()
{
  var texts = document.getElementsByTagName("input");
  for(var i=0;i<texts.length;i++)
  {

    if(texts[i].type = "text")
    {
      texts[i].className = "text";
      texts[i].setAttribute("disabled",true);


    }
  }
}
或者用Jqeury的toggle函数更简单

在网页上显示替换成功了,但是没能解决问题.....其实我是想导出到excel里面..就算input输入框 display. 导出整张表到excel里面input输入框还是显示的的.. 想两个层替换这样的话,在网页上看是一行是条记录,但导到excel里面就变成一行里有2条记录

不就是把文本去掉吗？最简单的方法就是用以CSS 看起来效果一样。

楼上的还是没明白意思...用CSS 让文本框display,然后显示另一层的文本是可以.但是这样不代码这个页面上文本框不存在...我把整个表单导出到excel表格里...文本框和文本都显示出来了。..

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <style>
  .text{

  }
  .fra{
border:0px;
  }
  </style>
  <script>
  function f(){
var tds = document.getElementsByTagName('input');
for(var i=0;i<tds.length;i++){
if(tds[i].className == 'text')
tds[i].className = 'fra';
else
tds[i].className = 'text';
}
  }
  </script>
</HEAD> <BODY>
  <table style='border:1px red solid;border-collapse:collapse;'>
  <tr>
  <td style='border:1px red solid'><input type="text" class="text" align="left" id="f_name1" name="f_name1" value="2"  size="7" ></td>
  <td style='border:1px red solid'><input type="text" class="text" align="left" id="f_name2" name="f_name2" value="3"  size="7" ></td>
  </tr>
  <tr>
  <td style='border:1px red solid'><input type="text" class="text" align="left" id="f_name1" name="f_name1" value="2"  size="7" ></td>
  <td style='border:1px red solid'><input type="text" class="text" align="left" id="f_name2" name="f_name2" value="3"  size="7" ></td>
  </tr>
  </table>
  <input type=button value=frame onclick='f()'/>
</BODY>
</HTML>

你要去掉还不容易...
最后加句a.removeNode();

楼上的言外之意我明白..没想求现成的...
回18楼刚看了点DOM的东西
a.removeNode();
删除text以后然后添加
var td_node = document.createElement("td");
var text_node = document.createTextNode(<%=rs4.getString("f_name")%>);
td_node.appendChild(text_node);
这样就完成了第1步但想再回到text文本框呢?已经删除掉了a了...
是不是开始用数组把所有text文本框全部存进去呢?
这代码怎么写?

funtion test(obj)
{
    varshow = true;
    if(varshow)
    {
         obj.innerHTML = '<input type="text" class="text" align="left" id="f_name <%=k%>" name="f_name <%=k%>" value=" <%=rs4.getString("f_name")%>"  size="7" > ';
         varshow = false;
    }
    esle
    {
        obj.innerHTML = '<%=rs4.getString("f_name")%>';
    }
}
然后在Textbox添加onclick="test(this);"
have a try

sorry
在else里面加上一句 varshow = true;

如果你的这些文本框的class都是text的话，你可以用ClassName进行分组
var items = document.getElementsByTagName("input");
for(var i=0;i<items.length;i++)
{
   if(items[i].className=="text")
   {
      if(items[i].type=="text")
      {
         items[i].value=“要写的值”
      }
   }
}

准备数据
那你就不用担心text删除而数据丢失了。从你页面上看，你的数据都是从后台来的，那你就先把数据转为JS的数据存储，用到的时候就方便了。

<td><input ...../></td> 这个TD 的childNodes是<input ....>没错把?
个么<td></td>里想有两个 <input ....>呢？？他们2个一起算一个childNodes，还是第一个input算一个childnodes?

不要删除，就是CSS的改变，原本你就有2个在页面里，只是通过JS改变CLASS来显示和隐藏

text的文本框有特殊属性数据的话就要想办法把他存去另外一个地方.
如果没有.就直接生成新的.把前面的innerText放去value

回复楼上...显示隐藏在页面上只显示一行记录..但是我把整张表单导到excel后,里面显示的是整张表单里的元素..意思就会显示2行记录...现在就是为了解决这个问题.用input文本框是因为数据还要给使用者编辑.但文本框导到excel里面,表格就会被框架所覆盖或者超出所以想要改成文本...

text文本的特殊属性?ID NAME 什么算不算因为还要传值到另一个页面提交

21楼是function test() 不过尝试过后js有错误删除你的就没问题..

如果你是用FORM提交.
直接把那个控件移到FORM以外隐藏.要的时候拿回来.

郁闷了....思路终于清晰了。..知道要用DOM 先把所有input text节点存放到数组里面,然后删除节点.
然后 createTextNode 创建节点. 若要再换成input text 就调用数组用kid.replaceChild(repKid,kid)
替换掉..但是代码怎么写都 js 都不运行不成功...一头雾水今天第一次接触DOM

回来的时候直接拿父节点appendChild

^_^<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>单元格输入</title>
</head><body>
<table border="1" width="200" id="edTAB">
<tr>
<td width="180">
<input type="text" class="text" align="left" id="f_name2" name="f_name2" value="rs4.getString(f_name)-2" size="7" >
</td>
<td>
<input id="bt2" onclick=cha(this) value="确定" type=button>
</td>
</tr>
<tr>
<td width="100">
<input type="text" class="text" align="left" id="f_name3" name="f_name3" value="rs4.getString(f_name)-3" size="7" >
</td>
<td>
<input id="bt3" onclick=cha(this) value="确定" type=button>
</td>
</tr>
</table>
<SCRIPT language=javascript>

</SCRIPT></body></html>

测试一下以下代码,看看不是不你要的效果!<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>
<html>
<head>
<script language="javascript">
function doit(){
var a=document.getElementById("t1");
if(a.style.display=="none"){
document.getElementById("t1").style.display="block";
document.getElementById("show").style.display="none";
document.getElementById("ed").value="确定";
}else{
document.getElementById("t1").style.display="none";
document.getElementById("show").innerText=document.getElementById("t1").value;
document.getElementById("show").style.display="block";
document.getElementById("ed").value="编辑";
}
}
</script>
</head>
<body>
<%
dim xx
xx=request.querystring("excel")
%>
<table border="1" width="50%" height="40">
<tr>
<td width="60%">
<%
if xx="yes" then
response.write ""
else
%>
<input type="text" value="测试" name="t1" id="t1" style="display:none">
<% end if %>
<span id="show">测试</span>
</td>
<%
if xx="yes" then
response.write ""
else
%>
<td width="40%">
<input type="button" value="编辑" id="ed" onclick="doit()">
</td>
<% end if %>
</tr>
</table>
<%
if xx="yes" then
response.write ""
else
%>
<input type="button" value="导出到EXCEL" onClick="window.open(location.href+'?excel=yes')">
<% end if %>
<%
if request.querystring("excel")="yes" then
response.ContentType ="application/vnd.ms-excel" '这里调用excel函数.
end if
%>
</body>
</html>

不好意思，昨天写错了几个单词
varshow = true;
function tesdfsdfst()
{
    var obj = document.getElementById("td_id");//要修改的td的id
    alert(obj);

    if(varshow)
    {
obj.innerHTML = '<input type="text" class="text" align="left" id="f_name<%=k%>" name="f_name<%=k%>" value="<%=rs4.getString("f_name")%>"  size="7" > ';
varshow = false;
    }
    else
    {
obj.innerHTML = '<%=rs4.getString("f_name")%>';
varshow = true;
    }
}
然后在button添加onclick事件就可以了

VB？？？还有<% ??无语了。

感谢下38楼的代码..测试了下就是这样的效果已经很接近了但是这样只能改一个input text 而且还是 var obj=_this.parentNode.parentNode.cells[0] 相对_this的节点位置. 页面上众多input text 一次性该怎么改呢?关键是位置如何定位

因为38楼button 名字是bt2 所以用substr(2) 取第2个后面的字符数字.我有很多input text 命名规则也相同,最后一位是数字..所以我就改用slice(-1) 取最后一位...function $(id){return document.getElementById(id)}
function cha(_this){
    var id="f_name"+_this.id.substr(2)
    var obj=_this.parentNode.parentNode.slice(-1)
    if ($(id)){
        _this.name=$(id).value
        obj.innerHTML=_this.name;
        _this.value="编辑"
    }
    else {
        _this.name=obj.innerHTML
        obj.innerHTML="<input type='text' class='text' align='left' id='"+id+"' name='"+id+"' value='"+_this.name+"' size='7' >"
        _this.value="确定"
    }
}理解了下代码...caiying2009貌似是用_this.name来当中转变量。..这样我若是很多个input text 不是需要很多个中转变量?

在大家的帮助和指导下我自己把代码改成如下var t =1;
var array= new Array();
var id= new Array();
function cha2(){
var inputs = document.getElementById("form1").getElementsByTagName("input");
for(var i=0; i<inputs.length; i++)
{
if(inputs[i].type == "text")
{
array[i]=inputs[i].value;
}
}

for(var i=0; i<inputs.length; i++)
{
if(inputs[i].type == "text")
{
id[i]=inputs[i].id;
}
}

if(t%2==1)
{
for(var i=0; i<array.length; i++)
{
var obj=_this.parentNode.parentNode.cells[0]; obj.innerHTML=array[i];
}
document.button.value="编辑"
}
else
{
for(var i=0; i<array.length; i++)
{
var obj=_this.parentNode.parentNode.cells[0];
array[i]=obj.innerHTML;
obj.innerHTML=" <input type='text' class='text' align='left' id='"+id+"' name='"+id+"' value='"+inputs[i]+"' size='7' >"
}
document.button.value="确定"
}
t++;
}
红色部分的代码是我所不懂的..也是38楼用来定位节点的..
红色部分代码怎么改才能定位到 input text 或者文本相应的位置?

this?<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>单元格输入_全表格</title>
</head>
<body>
<table border="1" width="200" id="edTAB">
<form name="form1">
    <tr>
        <td width="180">
         <input type="text" class="text" align="left" id="f_name1" name="f_name1" value="rs4.getString(f_name)-1" size="27" >
        </td>
    </tr>
    <tr>
        <td width="180">
         <input type="text" class="text" align="left" id="f_name2" name="f_name2" value="rs4.getString(f_name)-2" size="27" >
        </td>
    </tr>
    <tr>
        <td width="180">
         <input type="text" class="text" align="left" id="f_name3" name="f_name3" value="rs4.getString(f_name)-3" size="27" >
        </td>
    </tr>
</form>
</table>
<input id="button" onclick=cha() value="准备提交" type=button><SCRIPT language=javascript>

</SCRIPT>
</body></html>

调试易

text值显示的问题,应该不难,接分了

解决方案 »