738
我用JS写的一段创建TABLE，添加行，模糊匹配，根据CHECKBOX删除内容，创建标题的代码（删除完再添加行有计数器的BUG）
做错了，贴出来，需要用JQUERY做，现在完全整成DOM和JS做的了
效果图：
代码：
<html>
<head>
<script type="text/javascript" src="jquery-1.7.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("p").click(function() {
$(this).hide();
});
});
var flag=true
var tb1 = document.createElement("TABLE")
function clearNoNum(obj)
{
//先把非数字的都替换掉，除了数字和.
obj.value = obj.value.replace(/[^\d.]/g,"");
//必须保证第一个为数字而不是.
obj.value = obj.value.replace(/^\./g,"");
//保证只有出现一个.而没有多个.
obj.value = obj.value.replace(/\.{2,}/g,".");
//保证.只出现一次，而不能出现两次以上
obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
}
function addTable(){
if(flag!=false)
{
flag=false;
tb1.;
tb1.border="1px";
var row1 = tb1.insertRow(0);
var cell1=row1.insertCell(0);
var cell2=row1.insertCell(1);
var cell3=row1.insertCell(2);
var cell4=row1.insertCell(3);
var cell5=row1.insertCell(4);
var cell6=row1.insertCell(5);
var cell7=row1.insertCell(6);
document.getElementById("d2").appendChild(tb1);
cell1.innerHTML="选项";
cell2.innerHTML="序号";
cell3.innerHTML="编号";
cell4.innerHTML="名称";
cell5.innerHTML="位置";
cell6.innerHTML="数量";
cell7.innerHTML="单价";
row1.insertCell(7).innerHTML="价格";
}
}
function insRow()
{
var x=document.getElementById('myTable').insertRow(0)
var y=x.insertCell(0)
var z=x.insertCell(1)
y.innerHTML="NEW CELL1"
z.innerHTML="NEW CELL2"
}
function saveTable()
{
document.getElementById('myTable').disabled=true;
}
function editTable()
{
document.getElementById('myTable').disabled=false;
}
function createCaption()
{
var x=document.getElementById('myTable').createCaption()
x.innerHTML="我的表格标题"
}
function insertRow() //增加的一行方法
{
newRow=document.all.myTable.insertRow(-1);
var j_1 = document.all.myTable.rows.length;
newcell=newRow.insertCell();
newcell.innerHTML=""+(j_1-1)+"";
newcell=newRow.insertCell() ;
newcell.innerHTML="<input type='text' onkeyup='clearNoNum(this)' name='zzkText' />";
newcell=newRow.insertCell() ;
newcell.innerHTML="<input type='text' onkeyup='clearNoNum(this)' name='zzkText' />";
newcell=newRow.insertCell() ;
newcell.innerHTML="<form><select id='mySelect'><option>库存A</option><option>库存B</option><option>库存C</option></select></form>";
newcell=newRow.insertCell() ;
newcell.innerHTML="<input type='text' name='zzkText"+j_1+"' />";
newcell=newRow.insertCell() ;
newcell.innerHTML="<input type='text' name='zzkText"+j_1+"' />";
newcell=newRow.insertCell() ;
newcell.innerHTML=""+(j_1-1)+"";
newcell=newRow.insertCell() ;
newcell.innerHTML="<input type='checkbox' name='mycheck' />";
document.all.myTable.focus();
}
function deleteRow()
{
var ok=document.getElementsByName("mycheck");
for(var k=0;k<ok.length;k++)
{
if(ok[k].checked==true)
{
tb1.deleteRow(k+1);
k=k-1;
}
}
}
</script>
</head>
<body>
<p>如果你点击我，我就消失</p>
</br>
<div >
<input type="button" value="创建" >
<input type="button" value="添加" >
<input type="button" value="删除" >
<input type="button" value="保存" >
<input type="button" value="编辑" >
<input type="button" value="复制">
<input type="button" value="创建标题">
</div>
<div >
</div>
<div >
</div>
</body>
</html>
最后更新：2017-04-02 22:16:36