使用輸入表單更改表格的單元格內容

Question

對於使用Javascript的練習，我創建了一個基於單擊的單元格的表格，它會更改該單元格的背景顏色。現在我正在嘗試設置我的表格，以便在單擊某個單元格時打開一個輸入框，您可以在其中更改單元格的內容。我認爲這將是一個10分鐘的項目，轉向一個小時即可搞清楚。任何幫助或想法都會有所幫助。謝謝！！

Answer 1

不是太強悍。這是一個工作示例。

http://jsfiddle.net/B5rvp/2/

$('td').click(function(){ 
    var answer = prompt("Enter New Value", ''); 
    $(this).html(answer);   
}); 

Answer 2

，如果你提供你與迄今使用的代碼這將是有益的。

下面是一個通用示例，其中TD包含一個輸入和一個文本節點。

工作例如：http://jsfiddle.net/NCQv2/

HTML

<table> 
    <tr><td>CLICK HERE<input></td></tr> 
</table> 

CSS

input { 
    display:none; 
} 

的JavaScript

var td = document.getElementsByTagName('td')[0]; 

td.onclick = function(e) { 
    var e = e || event; 
    var target = e.target || e.srcElement; 
    if(target.nodeName !== "INPUT") { 
     var input = this.getElementsByTagName('input')[0]; 
     if(input && input.style.display !== 'inline') { 
      input.style.display = 'inline'; 
      input.value = this.firstChild.data; 
      input.previousSibling.data = ''; 
      input.focus(); 
     } 
    } 
}; 

td.getElementsByTagName('input')[0].onblur = function() { 
    this.previousSibling.nodeValue = this.value; 
    this.style.display = 'none'; 
};