我用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.id="myTable";
   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 id="d1">
<input type="button"  value="创建" onclick="addTable()">
<input type="button"  value="添加" onclick="insertRow()">
<input type="button"  value="删除" onclick="deleteRow()">
<input type="button"  value="保存" onclick="saveTable()">
<input type="button"  value="编辑" onclick="editTable()">
<input type="button"  value="复制">
<input type="button"  onclick="createCaption()" value="创建标题">
</div>

<div id="d2">

</div>

<div id="d3">

</div>

</body>
</html>
时间: 2024-10-29 21:51:30

我用JS写的一段创建TABLE,添加行,模糊匹配,根据CHECKBOX删除内容,创建标题的代码(删除完再添加行有计数器的BUG)的相关文章

ASP.NET获取不到js写的cookie解决方法

今晚使用javascript设置一个来路的cookie,之后使用ASP.NET获取这个cookie值,发现ASP.NET获取不到JS设置的cookie值,真郁闷中,以下是JS写Cookie的代码:  Code //写cookies function setCookie(name,value) { document.cookie = name "=" escape (value) ";"; //设置的cookie关闭浏览即失效 } //JS设置来路写入到cookie

javascript-Jquery语句换成JS写这段

问题描述 Jquery语句换成JS写这段 求大神帮忙 第二句是别人打给我参考的 解决方案 看下代码,真挺麻烦 <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style> li {float:left; height:50px; width:50px; background:#ccc; list-sty

能否通过node.js写一段代码 实现自动导出svn的提交日志?

问题描述 能否通过node.js写一段代码 实现自动导出svn的提交日志? 目前的难点是只能查看svn的提交日志 无法通过代码获取 求提示 解决方案 http://blog.csdn.net/xu1314/article/details/6185361

我写的这段代码是不是有问题,都没效果。就是鼠标移入移出让它高亮。

问题描述 我写的这段代码是不是有问题,都没效果.就是鼠标移入移出让它高亮. 代码如图所示,我想实现鼠标移到li的时候把它的样式改为active,其实就是高亮.然后移除li的时候把li去除.悬赏的币不多,请见谅!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! 解决方案 解决方案二: 上面Js中多了个分号,我把分号去掉,结果也一样,样式用的是boostrap 解决方案三: http://m.blog.csdn.net/article/details?id=50

javascript-JS正则匹配首尾为中括号的一段任意字符,需要匹配中括号本身,该如何写?

问题描述 JS正则匹配首尾为中括号的一段任意字符,需要匹配中括号本身,该如何写? 问题描述:在一段文本里,匹配" [XXXX] "然后把 "[XXXX] "替换成替他内容,XXXX为任意字符,用正则表达式该怎么去匹配? 解决方案 /^[[sS]{1,}]$/可以试试 解决方案二: 这个别人写的一个自定义控件 这一段是 声明了一个新的控件对象 并传递了两个参数 第一个为字符串 第二个为匿名对象 参数具体含义 需要参考Slide控件的说明文档才可以 你可以去源文件里看看

小白用php仿照js写的一个加密方法 就是有问题 求解答

问题描述 小白用php仿照js写的一个加密方法 就是有问题 求解答 原本的js是一段加密的方法 function checkform() { var dcode; var dcode1; var dcode2; dcode=document.form1.pwd.value; dcode1=""; dcode2=1275903582 dcode2=""+dcode2*137; var tmpstr; var dcodelen; dcodelen=dcode.lengt

javascript-看看我写额这段jquery有没有问题

问题描述 看看我写额这段jquery有没有问题 var sFood1 = $('#food1'), sFood2 = $('#food2'), sAge = $('#age'), sSex = $('#sex') //去掉第一个名列和最后一个操作列 , tdSums = $('#trSum td:gt(0)').not(':last') , tdAges = $('#trAge td:gt(0)').not(':last') , tdDiffs = $('#trDiff td:gt(0)').n

JS动态创建Table,Tr,Td并赋值的具体实现

成果库修改:       要求主题列表随成果类型改变而改变       网上查询资料后开工,在成果类型下拉框添加change()事件触发Dwr,查询主题集合--动态创建/编辑Table       概要代码如下: JS   复制代码 代码如下: //动态获取主题数据 function getzts(){     parentId = document.getElementById("bselect1").value;     if(parentId!=""){   

js写的评论分页

 js写的分页在网上可以搜到很多的文章,在也为大家介绍一个,喜欢的的朋友可以参考下 代码如下: <%@ page language="java" contentType="text/html; charset=utf-8"  pageEncoding="utf-8"%>  <%  String path = request.getContextPath();  String basePath = request.getSchem