どうか私を助けてください。私はJavaScriptに新しいです。ユーザーがjavascriptとhtmlを使用して行を選択したときに、フォーム自体にテーブルエントリが削除されます。 削除機能を試しましたが、見出しも削除します。ユーザーは行を選択し、削除する必要があります。htmlとjavascriptのテーブルエントリを削除するには
htmlコード:
<body>
<form>
<h2>Receipt</h2>
<table>
<tr>
<td>
<label for="ctype">Charge Type</label>
</td>
<td>
<input id="ctype" name="ctype" placeholder="--" style="border: none;" type="text" />
</td>
</tr>
<tr>
<td>
<label for="amt">Amount</label>
</td>
<td>
<input id="amt" name="amt" placeholder="--" style="border: none;" type="text" />
</td>
</tr>
<tr>
<td>
<label for="camt">Cash Amount</label>
</td>
<td>
<label>100</label>
</td>
</tr>
</table>
<br><input type="reset" name="reset" id="resetbtn" style="border: none; height:30px; width:100px;" class="resetbtn" value="Reset" />
<button type="button" style="border: none; height:30px; width:100px;" onClick="updateForm();"/>Add To Table</button>
<button type="button" style="border: none; height:30px; width:100px;" onClick="saveForm()" />Save</button>
<button type="button" style="border: none; height:30px; width:100px;" onClick="deletRow()" />Remove</button>
</form>
<br>
<table id="results" width="360">
<thead>
<tr>
<th scope="col" width="120">Charge Type</th>
<th scope="col" width="120">Amount</th>
</tr>
</thead>
</table>
<table id="resultTotals" width="360">
<tr>
<td scope="col" width="120">Totals</td>
<td scope="col" width="120"><div id="amtTotals"></div></td>
</tr>
</table>
</body>
Javascriptコード:
<script>
var amtTotal = 0;
function updateForm() {
var ctype = document.getElementById("ctype").value;
var amt = document.getElementById("amt").value;
amtTotal = amtTotal + parseInt(amt);
document.getElementById("amtTotals").innerHTML=amtTotal;
var table=document.getElementById("results");
var row=table.insertRow(-1);
var cell1=row.insertCell(0);
var cell2=row.insertCell(1);
cell1.innerHTML=ctype;
cell2.innerHTML=amt;
}
function saveForm() {
if(amtTotal < 100){
alert("Thank you");
} else
{
alert("Invalid Amount")
}
}
function deletRow() {
document.getElementById("results").deleteRow(0);
}
</script>
はありがとうございました。文法には申し訳ありません。この
4のような総量でマイナス現在の行量に必要除去しながら
行0は、それが削除されますので向かっています。あなたはヘッダーの後に単一の行を削除するか、ヘッダーの後にすべての行を削除する必要があります – JYoThI
私は選択された行を削除したいが、私はjavascriptでそれを適用する方法を知らない – pkm
jqueryを使用するのは大丈夫ですか? – JYoThI