如何在html和javascript中删除表项
请帮帮我。我是javascript新手。我希望在用户使用javascript和html选择行时删除表单本身的表条目。 我尝试删除函数,但它删除标题太多,我不想。用户应选择行并将其删除 html代码:如何在html和javascript中删除表项,javascript,html,Javascript,Html,请帮帮我。我是javascript新手。我希望在用户使用javascript和html选择行时删除表单本身的表条目。 我尝试删除函数,但它删除标题太多,我不想。用户应选择行并将其删除 html代码: <body> <form> <h2>Receipt</h2> <table> <tr> <td>
<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>
收据
电荷类型
数量
现金数额
100
添加到表中
拯救
去除
电荷类型
数量
总数
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>
var Amttottal=0;
函数updateForm(){
var ctype=document.getElementById(“ctype”).value;
var amt=document.getElementById(“amt”).value;
amttottal=amttottal+parseInt(金额);
document.getElementById(“amtTotals”).innerHTML=amtTotal;
var table=document.getElementById(“结果”);
var行=table.insertRow(-1);
var cell1=行插入单元格(0);
var cell2=行插入单元格(1);
cell1.innerHTML=ctype;
cell2.innerHTML=amt;
}
函数saveForm(){
如果(amtTotal<100){
警惕(“谢谢”);
}否则
{
警报(“无效金额”)
}
}
函数deletRow(){
document.getElementById(“结果”).deleteRow(0);
}
多谢各位。对不起,语法错误。1)为每行创建复选框
2) 基于复选框删除该行
3) 删除时,您需要将当前行的金额减去总金额,如下所示
4) 还有一个技巧,你需要从下到上删除最后一行。如果从上到下删除行,将抛出行索引错误
var amttottal=0;
函数updateForm(){
var ctype=document.getElementById(“ctype”).value;
var amt=document.getElementById(“amt”).value;
amttottal=amttottal+parseInt(金额);
document.getElementById(“amtTotals”).innerHTML=amtTotal;
var table=document.getElementById(“结果”);
var行=table.insertRow(-1);
var cell1=行插入单元格(0);
var cell2=行插入单元格(1);
var cell3=行插入单元格(2);
cell1.innerHTML=ctype;
cell2.innerHTML=amt;
cell3.innerHTML='';
}
函数saveForm(){
如果(amtTotal<100){
警惕(“谢谢”);
}否则
{
警报(“无效金额”)
}
}
函数deletRow(){
//document.getElementById(“结果”).deleteRow(0);
var table=document.getElementById('results');
var rowCount=table.rows.length;
//警报(行计数);
变量行_id=[];
//var i=1在收割台之后开始
对于(变量i=rowCount-1;i>=rowCount-(rowCount-1);i--){
var row=表.行[i];
//td contain复选框的索引为8
国际单项体育联合会(世界其他地区)
{
var chkbox=row.cells[2]。getElementsByTagName('input')[0];
var current\u row\u amount=行。单元格[1]。innerHTML;
//警报(chkbox.checked);
if('checkbox'==chkbox.type&&true==chkbox.checked){
//行标识推送(i);
表1.删除行(i);
amtTotal=amtTotal parseInt(当前行金额);
document.getElementById(“amtTotals”).innerHTML=amtTotal;
}
}
}
}
收据
电荷类型
数量
现金数额
100
添加到表中
拯救
去除
电荷类型
数量
总数
第0行为标题,因此将其删除。您需要删除标题后的单行或标题后的所有行?我想删除所选行,但不知道如何在JavaScription中应用它。使用jquery可以吗?如果可能,那么没有问题。请尝试下面的答案@pkmglad以帮助您@pkm