2016-05-25 38 views
1

現在、私はjavascriptを使ってプロジェクトを行っています。テーブルに行を挿入するボタンがあります。各行には3つのセルがあります。これらのセルの1つは編集可能でなければならないため、ユーザーはそこにリンクを書き込むことができます。どうすればこれを達成できますか?ありがとう。 私はJQUERYを使用しないでください! mycode:Javascript:セルを編集可能にする

<head> 
<style> 
table, td { 
border: 1px solid black; 
} 
</style> 
<script type="text/javascript"> 
function Insert(){ 
var x=document.getElementById("myTable"); 
var row=x.insertRow(1); 
var cell1=row.insertCell(0); 
var cell2=row.insertCell(1); 
var cell3=row.insertCell(2); 
cell1.innerHTML=document.getElementById("myTxt"); 


} 


</script> 
</head> 

<body> 
<input id="myTxt" name="Text1" type="text" /> 
<input onclick="Insert()" name="Submit1" type="submit" value="Insert" /> 

<table id="myTable"> 
<tr id="myRow"> 
<td>Cell 1</td> 
<td>Cell 2</td> 
<td>Cell 3</td> 

</tr> 
</table> 
</body> 
+2

、あなたのテーブルを生成するとき、あなたはFORMタグ内にそれを持っている必要があります。これで、編集可能にする必要があるセルにテキストボックスINPUTを生成します。 – durbnpoisn

+0

上記を展開すると、「編集可能な」表のセルはありません。セル内にテキスト入力コントロールが必要です。正しく書式設定すると、セル自体が編集可能なように見えます。また、コンテンツを提出する予定がある場合は、フォームタグ内でのみ必要です。 JavaScriptで処理するだけであれば、フォームは必要ありません。 – SunKnight0

+0

@ SunKnight0あなたが言うように、私はどのようにセル内に入力コントロールを持つことができますか? –

答えて

1

これはJavaScriptでセル1に入力ボックスを挿入します:

function Insert() { 

var x=document.getElementById("myTable"); 
var row=x.insertRow(1); 
var cell1=row.insertCell(0); 

var txtBox = document.createElement("input"); 
txtBox.type = "text"; 
txtBox.name = "Text1"; 
txtBox.id = "myTxt"; 

cell1.appendChild(txtBox); 

var cell2=row.insertCell(1); 
var cell3=row.insertCell(2);  

} 
+0

あなたはそうです!どうもありがとう ! :) –

+0

これは問題の正解でしたか? –

+0

はい、正解でした:) –

関連する問題