js里INPUT的求救！


var h = function(){
inp.style.display = "none";
dv.style.display = "";
bu.style.display = "";
dv.innerText = inp.value;
};
var s = function(){
bu.style.display = "none";
dv.style.display = "none";
inp.style.display = "";
};
<input id="inp" onblur="h()">
<input id= "bu" type="button" value="输入" onclick="s()" style="display:none;">
<div id="dv" style="display:none;"></div>

解决方案 »

  1.   


    <!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="">
      <script>
    function doinput(){
    var val = aa.innerText;
    aa.innerHTML = "<input type=text onblur=dodis(this) value=\""+val+"\">";
    }
    function dodis(obj){
    var val = obj.value;
    aa.innerHTML = "";
    aa.innerText = val;
    }
      </script>
     </HEAD> <BODY>
      <span id=aa ondblclick=doinput()><input type=text onblur=dodis(this)></span>
     </BODY>
    </HTML>
      

  2.   

    http://hi.baidu.com/lael80/blog/item/47d964d99de579e938012f6f.htmlhttp://www.gzyd.net/lael/control.html
      

  3.   

    这个是display或者visibility的问题。2楼的正解，最好用document.getElementById标准写。
      

  4.   

    你可以这样子嘛~``
    不修改的时候，其实也是一个INPUT，但它的边框没有，或者边框颜色和背景相同，这样子，就看不出来是一个INPUT了，并且把这个INPUT设置成READONLY，修改的时候则显示边框，去除REALONLY~``这样子最简单了~``
      

  5.   


    <style>
    .ipt {border:1px solid #ffffff;}
    .ipt2 {border:1px solid #000000;}
    </style>
    <script>
    function _con(i){
    if(i == 1){
    ipt.className = "ipt2";
    ipt.readOnly = false;
    }else{
    ipt.className = "ipt";
    ipt.readOnly = true;
    ipt.blur();
    }
    }
    </script>
    <input id="ipt" class="ipt" onclick="_con(1);" onmouseout="_con(0);" value="aaa" readonly="true">
      

  6.   

    <table border="1">
    <tr>
    <td width="200" height="40" onclick="show(this);"><input type="text" onmouseout="hidden(this);"></td>
    </tr>
    </table>
    <script>
    function show(obj){
    var input=obj.firstChild;
    if(input.style.display=="none"){
    input.style.display="";
    obj.removeChild(input.nextSibling);
    }
    }
    function hidden(obj){
    obj.style.display="none";
    var text=document.createTextNode(obj.value);
    obj.parentNode.appendChild(text);
    }
    </script>
      

  7.   

    改点FF下的小BUG<table border="1">
    <tr>
    <td width="200" height="40" onclick="show(this);"><input type="text" onmouseout="hidden(this);"></td>
    </tr>
    </table>
    <script>
    function show(obj){
    var input=obj.firstChild;
    if(input.style.display=="none"){
    input.style.display="";
    obj.removeChild(input.nextSibling);
    }
    }
    function hidden(obj){
    if(obj.style.display==""){
    obj.style.display="none";
    var text=document.createTextNode(obj.value);
    obj.parentNode.appendChild(text);
    }
    }
    </script>
      

  8.   

    当再点一次的时候需要，多点一次INPUT激活有光标后才能出来
      

  9.   

    改成双击事件不就可以了么<table border="1">
        <tr>
            <td width="200" height="40" ondblclick="show(this);"><input type="text" onmouseout="hidden(this);"></td>
        </tr>
    </table>
    <script>
        function show(obj){
            var input=obj.firstChild;
            if(input.style.display=="none"){
                input.style.display="";
                obj.removeChild(input.nextSibling);
            }
        }
        function hidden(obj){
            if(obj.style.display==""){
                obj.style.display="none";
                var text=document.createTextNode(obj.value);
                obj.parentNode.appendChild(text);
            }
        }
    </script>
      

  10.   


    <input type="text" value="default value" style="border:0px;"
        onmouseover="this.style.border='1px solid #cccccc';"
        onmouseout="this.style.border='0px';this.blur();">