javascript “待办列表”的项目删除动态表格当前所在行问题,求指导
代码如下<body><p>本地留言版,刷新页面即清除,无法保留</p><divid="input"><inputid="bar1"type="text"/><button...
代码如下
<body>
<p>本地留言版,刷新页面即清除,无法保留</p>
<div id="input">
<input id="bar1" type="text"/>
<button id="button" onclick="input1();addtab();fnclear()">添加留言</button>
</div>
<!--<div id="bar2"></div>-->
<div id="tab"></div>
<script language="javascript">
function input1()//在框内输入内容
{
var kuang1 = document.getElementById("bar1")//现在这个KUANG1就代表的是这个文本框,
}
function fnclear()//清空输入框内容
{document.getElementById('bar1').value="";
}
function addtab() { //创建表格
var odiv = document.getElementById("tab");
var oTable = document.createElement("table");
oTable.setAttribute("border", 1, 0);
oTable.setAttribute("width", "600px");
for (i = 0; i < 1; i++) {
var tr = oTable.insertRow();
tr.innerHTML =" 事项:" + " " + document.getElementById("bar1").value + '<a href="javascript:void(0)" onclick="oTable.deleteRow()">删除</a>';//显示输入内容并添加删除按钮
}
odiv.appendChild(oTable);
}
</script>
</body>
问题:
tr.innerHTML =" 事项:" + " " + document.getElementById("bar1").value + '<a href="javascript:void(0)" onclick="oTable.deleteRow()">删除</a>';//显示输入内容并添加删除按钮
这个代码部分,删除按钮不生效,不知道如何来写,求指导 展开
<body>
<p>本地留言版,刷新页面即清除,无法保留</p>
<div id="input">
<input id="bar1" type="text"/>
<button id="button" onclick="input1();addtab();fnclear()">添加留言</button>
</div>
<!--<div id="bar2"></div>-->
<div id="tab"></div>
<script language="javascript">
function input1()//在框内输入内容
{
var kuang1 = document.getElementById("bar1")//现在这个KUANG1就代表的是这个文本框,
}
function fnclear()//清空输入框内容
{document.getElementById('bar1').value="";
}
function addtab() { //创建表格
var odiv = document.getElementById("tab");
var oTable = document.createElement("table");
oTable.setAttribute("border", 1, 0);
oTable.setAttribute("width", "600px");
for (i = 0; i < 1; i++) {
var tr = oTable.insertRow();
tr.innerHTML =" 事项:" + " " + document.getElementById("bar1").value + '<a href="javascript:void(0)" onclick="oTable.deleteRow()">删除</a>';//显示输入内容并添加删除按钮
}
odiv.appendChild(oTable);
}
</script>
</body>
问题:
tr.innerHTML =" 事项:" + " " + document.getElementById("bar1").value + '<a href="javascript:void(0)" onclick="oTable.deleteRow()">删除</a>';//显示输入内容并添加删除按钮
这个代码部分,删除按钮不生效,不知道如何来写,求指导 展开
展开全部
首先,是被写入的<a href="javascript:void(0)" onclick="oTable.deleteRow()">删除</a>
onclick执行的是一个独立的过程,需要独立的函数支持deleteRow()是删除行,但是不能这么调用。重新定义一个函数,
我在你写的基础上做了一下修改
function input1()//在框内输入内容
{
var kuang1 = document.getElementById("bar1")//现在这个KUANG1就代表的是这个文本框,
}
function fnclear()//清空输入框内容
{document.getElementById('bar1').value="";
}
function addtab() { //创建表格
var odiv = document.getElementById("tab");
var oTable = document.createElement("table");
/* 需要给你添加的DIV增加一个识别的ID D.n.sky */
var len = document.getElementsByTagName('table').length;
oTable.setAttribute("border", 1, 0);
oTable.setAttribute("width", "600px");
/* 添加 */
oTable.id = 't_' + len;
for (i = 0; i < 1; i++) {
var tr = oTable.insertRow();
/* 添加 D.n.sky */
tr.innerHTML =" 事项:" + i + " " + document.getElementById("bar1").value
+ '<a href="javascript:void(0)" onclick="del('+len+')">删除</a>';//显示输入内容并添加删除按钮
}
odiv.appendChild(oTable);
}
/* 删除的方法 */
var del = function (i){
var t = document.getElementById('t_'+i);
t.parentNode.removeChild(t);
}
展开全部
<body>
<p>本地留言版,刷新页面即清除,无法保留</p>
<div id="input">
<input id="bar1" type="text"/>
<button id="button" onclick="input1();addtab();fnclear()">添加留言</button>
</div>
<!--<div id="bar2"></div>-->
<div id="tab"></div>
<script language="javascript">
function input1()//在框内输入内容
{
var kuang1 = document.getElementById("bar1")//现在这个KUANG1就代表的是这个文本框,
}
function fnclear()//清空输入框内容
{document.getElementById('bar1').value="";
}
var odiv = document.getElementById("tab");
var oTable = document.createElement("table");
function addtab() { //创建表格
oTable.setAttribute("border", 1, 0);
oTable.setAttribute("width", "600px");
var tr;
var cell;
for (i = 0; i < 1; i++) {
tr = oTable.insertRow();
cell = tr.insertCell();
cell.innerHTML =" 事项:" + " " + document.getElementById("bar1").value + "<a href='javascript:void(0)' onclick='deleteRow()'>删除</a>";//显示输入内容并添加删除按钮
}
odiv.appendChild(oTable);
}
function deleteRow(){
oTable.deleteRow();
}
</script>
</body>
<p>本地留言版,刷新页面即清除,无法保留</p>
<div id="input">
<input id="bar1" type="text"/>
<button id="button" onclick="input1();addtab();fnclear()">添加留言</button>
</div>
<!--<div id="bar2"></div>-->
<div id="tab"></div>
<script language="javascript">
function input1()//在框内输入内容
{
var kuang1 = document.getElementById("bar1")//现在这个KUANG1就代表的是这个文本框,
}
function fnclear()//清空输入框内容
{document.getElementById('bar1').value="";
}
var odiv = document.getElementById("tab");
var oTable = document.createElement("table");
function addtab() { //创建表格
oTable.setAttribute("border", 1, 0);
oTable.setAttribute("width", "600px");
var tr;
var cell;
for (i = 0; i < 1; i++) {
tr = oTable.insertRow();
cell = tr.insertCell();
cell.innerHTML =" 事项:" + " " + document.getElementById("bar1").value + "<a href='javascript:void(0)' onclick='deleteRow()'>删除</a>";//显示输入内容并添加删除按钮
}
odiv.appendChild(oTable);
}
function deleteRow(){
oTable.deleteRow();
}
</script>
</body>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询