<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>
联动和增加行
</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
function jl1(value){
document.getElementById("ml2").options.length = 0;
var selectObj = document.getElementById("ml2");
selectObj.options[selectObj.length] = new Option("全部","");
if(value==‘1‘){
??selectObj.options[selectObj.length] = new Option(‘v1‘,‘v1‘);
??selectObj.options[selectObj.length] = new Option(‘v2‘,‘v2‘);
}
if(value==‘2‘){
??selectObj.options[selectObj.length] = new Option(‘vv1‘,‘vv1‘);
??selectObj.options[selectObj.length] = new Option(‘vv2‘,‘vv2‘);
}
fz();
}
function fz(){
var ml1 = $("#ml1").val();
var ml2 = $("#ml2").val();
var ml = (ml2==‘‘||ml2==null)?ml=ml1:ml=ml2;
$("#ml").val(ml);
//alert($("#ml").val());
}
/**
success:function(res){
???????????????
??var result = res.split(";");
??var tep;
??
??document.getElementById("ml2").options.length = 0;
??var selectObj = document.getElementById("ml2");
??selectObj.options[selectObj.length] = new Option("全部","");
??if(result!=""&&result!=null){
??for (i = 0; i < result.length; i++) {
??tep = result[i]
??var tmparr = tep.split(",");
??selectObj.options[selectObj.length] = new Option(tmparr[1],tmparr[0]);
??}
??}
??changeValue();
}
*/
function addTr(){
$("#tbody").append(createNewRow());
sortNumber();
}
function createNewRow(){
var index = $(".tr");
var td = $("#tr1").html();
var tr = "<tr id=‘tr"+index.length+"‘ class=‘tr‘>"+td+"</tr>";
return tr;
}
function sortNumber(){
$(".xh").each(function(index,obj){
$(obj).html(index+1);
$(obj).parents(‘tr‘).attr("id","tr"+(index+1));
});
}
function delTr(obj){
var tr = $(".tr").length;
if(tr==1){
alert("必须保留一行");
return;
}
$(obj).parents(‘tr‘).remove();
???sortNumber();
}
</script>
</head>
<body>
<input id=‘ml‘ name=‘ml‘ type=‘hidden‘/>
<select onchange="jl1(this.value)" id=‘ml1‘>
<option value ="">全部</option>
<option value ="1">1</option>
<option value ="2">2</option>
<option value ="3">3</option>
</select>
<select id=‘ml2‘ onchange=‘fz()‘>
<option value ="">全部</option>
</select>
<br><br>
<br><br>
<br><br>
<input type=‘button‘ value=‘增加行‘ onclick=‘addTr()‘>
<table >
<tbody id=‘tbody‘>
<tr>
<td>序号</td>
<td>姓名</td>
<td>年龄</td>
<td>操作</td>
</tr>
<tr id=‘tr1‘ name=‘tr‘ class=‘tr‘>
<td class=‘xh‘>1</td>
<td>
<input name=‘name‘></input>
</td>
<td>
<input name=‘age‘></input>
</td>
<td>
<input type=‘button‘ value=‘删除‘ onclick="delTr(this)"></input>
</td>
</tr>
</tbody>
</table>
</body>
</html>
select 标签级联 和 html增加/删除行
原文地址：https://www.cnblogs.com/BigWrite/p/9166346.html