用JS在表单中动态添加的radio和checkbox怎么样删除呢?

Question

用的表格还是 DIV ？
如果表格 删掉 获取 TR元素， 删除不就行了

Answer 1

用div 吧的　display属性吧

Answer 2

如果实在觉得DOM操作麻烦，就用InnerHTML

Answer 3

<table>
    <tr>
        <td><input type="radio" name="A" value="1" onclick="del(this)">A1<td>
        <td><input type="radio" name="A" value="2">A2<td>
    </tr>
<table><script type="text/javascript">function del(t) {    t.parentNode.parentNode.removeChild(t.parentNode);}</script>建议多用firebug看看DOM阿

Answer 4

忘了说了,在FF中调试,radio/checkbox添加到表格的TD中

Answer 5

<table>
    <tr>
        <td><input type="radio" name="A" value="1" onclick="del(this)">A1<td>
        <td><input type="radio" name="A" value="2" onclick="add(this)">A2<td>
    </tr>
<table><script type="text/javascript">function add(t) { var newTd = document.createElement('td');
var newRadio = document.createElement('input');
newRadio.type = "radio";
newRadio.name = "A";
newRadio.value = 3;

newTd.appendChild(newRadio);
newTd.innerHTML += "A3";

t.parentNode.parentNode.appendChild(newTd);}function del(t) {    t.parentNode.parentNode.removeChild(t.parentNode);}</script>

Answer 6

//兼容IE/Firefox动态创建radio button
function createRadio(name,id,value,isChecked)
{
    var oRadio = null;
var isIE = window.navigator.userAgent.indexOf("MSIE")>=1 ? 1 :0;
    if(isIE)
    {
        oRadio = document.createElement("<input name='" + name + (isChecked ? "' checked='"+ isChecked +"'/>" : "' />"));
        oRadio.id = id;
        oRadio.type = "radio";
        oRadio.value = value;
    }
    else
    {
        oRadio = document.createElement("input");
        oRadio.setAttribute("type","radio");
        oRadio.setAttribute("id",id);
        oRadio.setAttribute("name",name);
        oRadio.setAttribute("value",value);
        if(isChecked)
        {
            oRadio.setAttribute("checked",isChecked);
        }        
    }
    return oRadio;
}//类别改变函数
function chgsType(arg)
{
var ofrm = document.forms['form1'];
var odTable =document.getElementById("dataList");
var rTrNum = odTable.getElementsByTagName("TR");
var parentfrm = window.opener.document.forms['theForm'];
//部门
var sUnitIndex = parentfrm.unName.value;
var sTypeIndex = arg.value;
var iLeng =  sFeeRuleAry[sUnitIndex][sTypeIndex].length;
var iTrNums = Math.ceil(iLeng/2);
var i=0; //新增前先把以前添加的radio清理掉
var rdoNum = document.getElementsByName("chkWorksType").length;
for(var j=0;j<rdoNum;j++)
{
var e=ofrm.elements[j];
var Radioid = "chkWorksType";
if(e.type=="radio" && e.id.indexOf(Radioid)>=0)
{
alert('j='+j+',rnum='+rdoNum+',objRDO='+e.id);
//odTable.removeChild(e);
e.parentNode.parentNode.removeChild(e.parentNode);
}
}
//新增前先把以前添加的行清理掉
for(var k=1;k<rTrNum.length;k++)
{
odTable.deleteRow(1);
}
//把项目添加到表中
for(i=0;i<iTrNums;i++)
{
var sIndex = 2*i;
var odTr = odTable.insertRow(-1);
var odTd = odTr.insertCell(-1);
var sTdVal = sFeeRuleAry[sUnitIndex][sTypeIndex][sIndex].split("|"); 
//odTd.innerHTML="<input type='radio' name=\"chkWorksType\" id=\"chkWorksType"+sIndex+"\" value='"+sTdVal[1]+"|"+sTdVal[2]+"' onclick=\"CCA(this,'"+sTdVal[0]+"','"+sTdVal[3]+"');\">"+sTdVal[0];
var rdo_name = "chkWorksType"; 
var rdo_id = "chkWorksType"+sIndex;
var rdo_val = sTdVal[1]+"|"+sTdVal[2]+"|"+sTdVal[3];
var rdo_checked = false;
var objRD = createRadio(rdo_name,rdo_id,rdo_val,rdo_checked);
objRD.onclick=function() {CCA(this);};
odTd.appendChild(objRD);
var obj_txt = document.createElement("span");
obj_txt.id="s"+sIndex;
obj_txt.innerHTML=sTdVal[0];
odTd.appendChild(obj_txt);
if((sIndex+1)<iLeng)
{
var odTd1 = odTr.insertCell(-1);
var sTdVal = sFeeRuleAry[sUnitIndex][sTypeIndex][sIndex+1].split("|"); 
//odTd1.innerHTML="<input type='radio' name=\"chkWorksType\" id=\"chkWorksType"+(sIndex+1)+"\" value='"+sTdVal[1]+"|"+sTdVal[2]+"' onclick=\"CCA(this,'"+sTdVal[0]+"','"+sTdVal[3]+"');\">"+sTdVal[0];
var rdo_name = "chkWorksType"; 
var rdo_id = "chkWorksType"+Math.round(sIndex+1);
var rdo_val = sTdVal[1]+"|"+sTdVal[2]+"|"+sTdVal[3];
var rdo_checked = false;
var objRD = createRadio(rdo_name,rdo_id,rdo_val,rdo_checked);
objRD.onclick=function() {CCA(this);};
odTd1.appendChild(objRD);
var obj_txt = document.createElement("span");
obj_txt.id="s"+Math.round(sIndex+1);
obj_txt.innerHTML=sTdVal[0];
odTd1.appendChild(obj_txt);
}
else
{
var odTd1 = odTr.insertCell(-1);
odTd1.innerHTML="&nbsp;";
}
}
//alert('u='+sUnitIndex+',t='+sTypeIndex+',l='+iLeng);
}
在FF中调试结果并不想象的结果!

Answer 7

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>选择作业类型</title>
<style type="text/css">
<!--
BODY {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 12px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; 
}
H3 {
PADDING-LEFT: 22px; FONT-WEIGHT: bold; FONT-SIZE: 14px; BACKGROUND: url(images/allright.gif) no-repeat; FLOAT: left; MARGIN-LEFT: 4px; PADDING-TOP: 4px; HEIGHT: 19px
}
td{
 FONT-SIZE: 14px;
}
hr {
 color: #0033FF;
 background-color: green;
 height: 1px;
 border: #0033FF 1px dashed;
}
.line { border-bottom: 1px solid red; border-left: 0px solid yellow; border-right: 0px solid blue; border-top: 0px solid green; }
-->
</style>
<script language="javascript"  type="text/javascript" src="inc/sworktype.js"></script>
<script language="javascript"  type="text/javascript" src="inc/checkfrom.js"></script>
</head><body>
<form id="form1" name="form1" method="post" action="">
 <table width="430" border="0" cellspacing="1" cellpadding="0">  <tr>
    <td><h3>请选择作业类型</h3></td>
  </tr>
  <tr>
    <td> 
<table width="100%" border="0" cellspacing="1" cellpadding="0" style="border:#0033FF 1px dotted">
 <tbody id="dataList">
      <tr>
        <td height="20" colspan="2"> &nbsp;&nbsp;<select name="sType" onchange="chgsType(this)">
        </select>
&nbsp;&nbsp;工作时间:
<input type="radio" name="WorkTime" value="1" checked>白天
<input type="radio" name="WorkTime" value="2">晚上
<hr size="1" noshade width="98%">
</td>
        </tr>
  </tbody>
    </table> </td>
  </tr>
  <tr>
    <td><fieldset name="fieldset"><br>
  <legend align="left"> 您选择的是：</legend><br> 
  <span id="sSelectedItemName">&nbsp;</span><br>
  <div id="iGoodsNumDiv" style="display:block">&nbsp;&nbsp;请输入数量: <input type="text" name="goodsNum" size="10" maxlength="10" class="line" onkeypress="onlyNumber(event)"><span id="goodsUnit"></span></div>
  </fieldset></td>  </tr>
  <tr>
    <td>&nbsp; </td>
  </tr>
  <tr>
    <td align="right"><input name="SubmitOk" type="button" id="SubmitOk" value="确定" onclick="GetSelectedCategory()"/>
      <input name="SubClose" type="button" id="SubClose" value="关闭" onclick="closeCancel()"/>
      &nbsp;&nbsp;</td>  </tr>
 </table>
</form>
</body>
</html>
<script language="Javascript">
<!--
initsWorkType_SelectList();
//-->
</script>
在这个页面中选择类别,然后清除添加的radio/checkbox,结果会留一个!

Answer 8

兄弟,代码不全阿, GetSelectedCategory() 和 closeCancel() 的function在哪里?

Answer 9

//部门
var sBmAry = Array('运输','仓储','箭牌库','物流','总务','配送中心','装卸队','装卸队');
//作业类别
var sWorkTypeAry = Array('卸火车','直入','入库','装火车','库区作业');
//编辑时保存原品名和单位,以免点击时更改,取消后无法恢复
var sSpmc = new Array('','','','');
var sUnitAry = Array(3);
/*
定额核算
数据:部门->类别->名称|定额<白天|黑夜>|单位
T:吨
*/
var sFeeRuleAry = new Array(8);
 sFeeRuleAry[0]= new Array(5);
 //0:运输,0:卸火车
sFeeRuleAry[0][0]=new Array('散板(人工)|280|280|T','豆柏、饲料、啤酒、麦芽(人工)|3*N|3.5*N|T','聚乙稀码盘配机械|2*N|2*N|T','密度板、刨花板|70|90|T','罐车板、大纸、卷板、轮胎|60|80|T','果冻、口香糖|130|150|T');
//1:直入
sFeeRuleAry[0][1]=new Array('散板(人工)|364|364|T','豆柏、饲料、啤酒、麦芽(人工)|3.9*N|4.55*N|T','聚乙稀码盘配机械|2.6*N|2.6*N|T','密度板、刨花板|91|117|T','罐车板、大纸、卷板、轮胎|78|104|T','果冻、口香糖|169|195|T');
//2:入库
sFeeRuleAry[0][2]=new Array('麦芽(人工)|240|240|T','麦芽(配机械)|3.5*N|3.5*N|T','啤酒、饲料(人力)|3*N|3*N|T','啤酒配机械|50|50|T','轮胎(百个以上)、盐|110|110|T','聚乙稀、板、轮胎(百个以下)|50|50|T','果冻|180|180|T','口香糖|150|150|T');
//3:装火车
sFeeRuleAry[0][3]=new Array('可乐饮料|120|120|T','其他商品|1*N|1*N|T');
//4:库区作业
sFeeRuleAry[0][4]=new Array('苫垛|10*N|10*N|个','打重车|10*N|10*N|个','打空车|5*N|5*N|个');
sFeeRuleAry[1]= new Array(5);
//1:仓储
sFeeRuleAry[1][0]= new Array();
sFeeRuleAry[1][1]= new Array();
sFeeRuleAry[1][2]= new Array();
sFeeRuleAry[1][3]= new Array();
sFeeRuleAry[1][4]= new Array('豆柏、棉粕、饲料、聚乙稀(人工)|3*N|3*N|T','啤酒(人力)、李锦记|3*N|3*N|T','聚乙稀配机械|2*N|2*N|T','热水器|0.2*N|0.2*N|个','轮胎(小)|0.15*N|0.15*N|条','轮胎(大)|0.4*N|0.4*N|条','地板|0.1*N|0.1*N|件','大纸、玻璃、卷板|1*N|1*N|件','日工|20*N|20*N|天','零活|2.5*N|2.5*N|小时');
//2:箭牌库
sFeeRuleAry[2]= new Array(5);
sFeeRuleAry[2][0]= new Array();
sFeeRuleAry[2][1]= new Array();
sFeeRuleAry[2][2]= new Array();
sFeeRuleAry[2][3]= new Array();
sFeeRuleAry[2][4]= new Array('口香糖|2.5*N|2.5*N|T','口香糖备货|3*N|3*N|T','零活|2.5*N|2.5*N|小时');
//3:物流
sFeeRuleAry[3]= new Array(5);
sFeeRuleAry[3][0]= new Array();
sFeeRuleAry[3][1]= new Array();
sFeeRuleAry[3][2]= new Array();
sFeeRuleAry[3][3]= new Array();
sFeeRuleAry[3][4]= new Array('日工|20*N|20*N|天','零活|2.5*N|2.5*N|小时');
//4:总务
sFeeRuleAry[4]= new Array(5);
sFeeRuleAry[4][0]= new Array();
sFeeRuleAry[4][1]= new Array();
sFeeRuleAry[4][2]= new Array();
sFeeRuleAry[4][3]= new Array();
sFeeRuleAry[4][4]= new Array('日工|20*N|20*N|天','零活|2.5*N|2.5*N|小时');
//5:配送中心
sFeeRuleAry[5]= new Array(5);
sFeeRuleAry[5][0]= new Array();
sFeeRuleAry[5][1]= new Array();
sFeeRuleAry[5][2]= new Array();
sFeeRuleAry[5][3]= new Array();
sFeeRuleAry[5][4]= new Array('豆柏、棉粕、饲料、聚乙稀(人工)|3*N|3*N|T','啤酒(人力)、李锦记|3*N|3*N|T','聚乙稀配机械|2*N|2*N|T','热水器|0.2*N|0.2*N|个','轮胎(小)|0.15*N|0.15*N|条','轮胎(大)|0.4*N|0.4*N|条','地板|0.1*N|0.1*N|件','大纸、玻璃、卷板|1*N|1*N|件','日工|20*N|20*N|天','零活|2.5*N|2.5*N|小时');
//6:装卸队
sFeeRuleAry[6]= new Array(5);
sFeeRuleAry[6][0]= new Array();
sFeeRuleAry[6][1]= new Array();
sFeeRuleAry[6][2]= new Array();
sFeeRuleAry[6][3]= new Array();
sFeeRuleAry[6][4]= new Array('日工|20*N|20*N|天','零活|2.5*N|2.5*N|小时');
//7:管理部
sFeeRuleAry[7]= new Array(5);
sFeeRuleAry[7][0]= new Array();
sFeeRuleAry[7][1]= new Array();
sFeeRuleAry[7][2]= new Array();
sFeeRuleAry[7][3]= new Array();
sFeeRuleAry[7][4]= new Array('大干|1*N|1*N|天','日工|20*N|20*N|天','零活|2.5*N|2.5*N|小时');
function MM_jumpMenu(targ,selObj,restore)
{ //v3.0
  eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
  if (restore) selObj.selectedIndex=0;
}//得到地址栏传递参数的函数
function QueryString(href,qs)
{
    var s = location.href;
    if (href != "") s = href;
    s = s.replace("#","").replace("?","?&").split("&");
    var re = "";
    for(i=1;i<s.length;i++)
        if(s[i].indexOf(qs+"=")==0)
            re = s[i].replace(qs+"=","");
    return re;
}function GetSelectedCategory()
{
var frmObj = document.forms['form1'];
var parentfrm = window.opener.document.forms['theForm']; //作业类别
var sType= sWorkTypeAry[frmObj.sType.value];
//行号
var sIndex =QueryString('','n');

//parent的作业类型
var CategoryTextName = eval('parentfrm.sWkType'+sIndex);
var CategorycPrice2Num = eval('parentfrm.cPrice'+sIndex);
var igoodsNum = eval("parentfrm.iNum"+sIndex);
var iTotalsNum = eval("parentfrm.cTotal"+sIndex);
//工作时间
var sWorkTime;
//工作类型,选择
var selectRadioValue;
//选择单选的计数变量
var n=0;
var k=frmObj.elements.length;
for (var i=0;i<k;i++)
    {
        var e=frmObj.elements[i];
alert('k='+k+',type='+e.type+',na='+e.name+',id='+e.id+',val='+e.value);
        if ( e.type == 'radio' )
        {
            if(e.checked)
            {
                 if(e.name.indexOf("WorkTime")>=0) 
sWorkTime = e.value;
 if(e.name.indexOf("chkWorksType")>=0) 
{
selectRadioValue = e.value;
n++;
}
            }
        }//endif
    }//endfor
alert('n='+n);
if(n<1)
{
alert('请选择一项类别!');
return false;
}

//各项工作的定额
var _selectRadioValue = selectRadioValue.split("|");
//白天
var sun_stand_value = _selectRadioValue[0];
//黑夜
var night_stand_value = _selectRadioValue[1];
var currentPrice="";
if(sWorkTime==2) 
{
CategoryTextName.value="夜|"+sType;
currentPrice=night_stand_value;
}
else
{
CategoryTextName.value=sType;
currentPrice=sun_stand_value;
}
var _gNums = frmObj.goodsNum.value;
if(_gNums=="" || _gNums<=0)
{
alert('请输入正确的数量!');
frmObj.goodsNum.focus();
return false;
}
if(currentPrice.indexOf("*N")>=0) 
{
currentPrice = currentPrice.replace("*N","");
igoodsNum.value=_gNums;
iTotalsNum.value= _gNums * currentPrice;
}
else
{
//数量
igoodsNum.value=_gNums;
//总计
iTotalsNum.value=currentPrice;
}
CategorycPrice2Num.value = currentPrice;
//alert(sType+','+sIndex+','+sWorkTime + ','+selectRadioValue);
//计算总和
js_iTotals();
//关闭窗口
window.close();
}function js_iTotals()
{
//统计总合并显示
var parentfrm = window.opener.document.forms['theForm'];
var Js_iTotal =0 ;
for(var i=1;i<=3;i++)
{
var pHJ = eval("parentfrm.cTotal"+i+".value");
Js_iTotal +=Math.round(pHJ*100)/100;
}
parentfrm.iTotal.value=Js_iTotal;
}这个加上上边的代码就是sworjtype.js的内容
谢谢你的热心!

Answer 10

function CCA(arg)
{
var frmObj = document.forms['form1'];
var parentfrm = window.opener.document.forms['theForm'];
var sPriceRule = arg.value.split('|');
var sUnit = sPriceRule[2];
var sText = document.getElementById('s'+arg.id.replace("chkWorksType",'')).innerHTML;
var sSpanName=document.getElementById("sSelectedItemName");
var sGdsNumDiv=document.getElementById("iGoodsNumDiv");
var sIndex = QueryString('','n');
var sTempstr="";
var sWkTime =  frmObj.WorkTime.length;
for(i=0;i<sWkTime;i++)
{
if(frmObj.WorkTime[i].checked)
{
sDayAndNight = frmObj.WorkTime[i].value;
break;
}
}
var currentPrice = (sDayAndNight==1)?  sPriceRule[0] : sPriceRule[1];
if(currentPrice.indexOf("*N")>=0)
{
//sGdsNumDiv.style.display="block";
frmObj.goodsNum.focus();
}
//sGdsNumDiv.style.display="none";
sSpanName.innerHTML ="&nbsp;&nbsp;"+sText+"<br>";
sUnit=sUnit.replace("T","吨");
//选择parent表单中的单位
var oLeng = eval("parentfrm.sUnit"+sIndex+".options.length");
for(var k=0;k<oLeng;k++)
{
if(eval("parentfrm.sUnit"+sIndex+".options["+k+"].value").indexOf(sUnit)>=0)
eval("parentfrm.sUnit"+sIndex+".options.selectedIndex="+k);
}
eval("parentfrm.uName"+sIndex+".value='"+sText+"'");
document.getElementById("goodsUnit").innerHTML=sUnit;
//alert(currentPrice+','+sDayAndNight);
}//初始化界面的作业类别选择列表
function initsWorkType_SelectList()
{
var frmObj = document.forms['form1'];
var parentfrm = window.opener.document.forms['theForm'];
var sUnit = parentfrm.unName.value;
if(sUnit==null) sUnit=0; var oj = frmObj.sType;
var count = sWorkTypeAry.length;

for (i=0;i<count;i++)
{
if(sFeeRuleAry[sUnit][i].length>=1)
{
oj.options.add(new Option(sWorkTypeAry[i],i));
}
}
//初始化类别
 chgsType(frmObj.sType);
//保存未改变前的值
 for(var i=1;i<4;i++)
{
sSpmc[i]=eval("parentfrm.uName"+i+".value");
sUnitAry[i]=eval("parentfrm.sUnit"+i+".options[parentfrm.sUnit"+i+".options.selectedIndex].value");
 }
}
function closeCancel()
{
var parentfrm = window.opener.document.forms['theForm']; for(var i=1;i<4;i++)
{
eval("parentfrm.uName"+i+".value='"+sSpmc[i]+"'");
var oLeng = eval("parentfrm.sUnit"+i+".options.length");
for(var k=0;k<oLeng;k++)
{
if(eval("parentfrm.sUnit"+i+".options["+k+"].value").indexOf(sUnitAry[i])>=0)
{
eval("parentfrm.sUnit"+i+".options.selectedIndex="+k);
break;
}
}
}
window.close();
}

Answer 11

已经解决,谢谢各位!问题在于:
var rdoNum = document.getElementsByName("chkWorksType").length;
    for(var j=0;j<rdoNum;j++)
    {

        var e=ofrm.elements[j];//直接取radio,不用取elements了
第二个: //新增前先把以前添加的行清理掉
    for(var k=1;k<rTrNum.length;
k++)
    {
        odTable.deleteRow(1);
    }rTrNum.length 在循环中会变化,应设为一个变量
改为var nn= rTrNum.length;
for(var k=1;k<nn;k++)
    {
        odTable.deleteRow(1);
    }