您的位置:首页 > Web前端 > JavaScript

用JavaScript操作和控制标签的资料

2006-03-05 16:30 253 查看
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 1</title>
</head>

<body>

<script>
function getrow(obj)
{
   if(event.srcElement.tagName=="TD"){
   curRow=event.srcElement.parentElement;
   alert("这是第"+(curRow.rowIndex+1)+"行");

   }
}
</script>

<table border="1" width="100%" onclick=getrow(this)>
  <tr>
    <td width="20%"> </td>
    <td width="20%"> </td>
    <td width="20%"> </td>
    <td width="20%"> </td>
    <td width="20%"> </td>
  </tr>
  <tr>
    <td width="20%"> </td>
    <td width="20%"> </td>
    <td width="20%"> </td>
    <td width="20%"> </td>
    <td width="20%"> </td>
  </tr>
</table>

</body>

</html>

document.all.myTable.deleteRow(xx)

xx表示某行,下标从0开始计算

动态添加表格的行!

<table border=1>
<tr id=a1>
<td><input></td><td><input></td>
</tr>
</table>
<input type=button name=ok onclick=add()>
<script language=JavaScript>
i=1
function add(){
var newTR = a1.cloneNode(true);
newTR.id="a"+(++i)
a1.parentNode.insertAdjacentElement("beforeEnd",newTR);
}
</script>

<button onClick="add()">add</button>
<button onClick="test()">test</button>
<table id="t1" border="1">
</table>
<script language="JavaScript">
function add(){
t1.insertRow().insertCell().innerHTML = '<input name="test'+t1.rows.length+'">';
}
function test(){
for(i=0;i<t1.rows.length;i++) alert(t1.rows.cells[0].innerHTML);
}
</SCRIPT>

<button onClick="add()">add</button>
<button onClick="del()">del</button>
<table id="t1" border="1"></table>
<script language="JavaScript">
function add(){
t1.insertRow().insertCell().innerHTML = '<input type="radio" name="tt"><input>';
}
function del(){
var c = document.getElementsByName('tt');
for(var i=0; i<c.length; i++)
if(c.checked)
t1.deleteRow(i);
}
</SCRIPT>

<button onClick="add()">add</button>
<button onClick="del()">del</button>
<button onClick="test()">test</button>
<table id="t1" border="1"></table>
<script language="JavaScript">
function add(){
t1.insertRow().insertCell().innerHTML = '<input type="radio" name="tt"><input name="test'+t1.rows.length+'">';
}
function del(){
var c = document.getElementsByName('tt');
for(var i=0; i<c.length; i++)
if(c.checked)
t1.deleteRow(i);
}
function test(){
for(i=0;i<t1.rows.length;i++) alert(t1.rows.cells[0].innerHTML);
}
</SCRIPT>

<table id=tab1 border=0 cellspacing=1 class=tab bgcolor=#CCCCCC width=300 align=left>
<tr bgcolor=yellow><td>名称</td><td>值</td></tr>
<script>
for(i=0;i<20;i++)
{document.write('<tr bgcolor=white onclick=add(this) onmouseout=this.bgColor="white" onmouseover=this.bgColor="#efffff"><td>第'+i+'行</td><td>第'+i+'列</td></tr></tr>')}
</script>

</table>
<table id=tab2 border=0 cellspacing=1 width=300 bgcolor=gray>
<tr bgcolor=redyellow id=tr1><td>名称</td><td>值</td></tr>
</table>

<script>
function add(obj)
{
//tab1.setExpression
 tr=tab2.insertRow()

 for(i=0;i<obj.cells.length;i++)
 {
 tr.style.backgroundColor="white"
 tr.onmouseout=function(){this.bgColor="white"}
 tr.onmouseover=function(){this.bgColor="#efffff"}
 tr.onclick=function(){add2(this)}
 tr.insertCell(i).innerHTML=obj.cells(i).innerHTML
 }
  tab1.deleteRow(obj.rowIndex)
}
function add2(o)
{
//tab1.setExpression
 tr=tab1.insertRow()

 for(i=0;i<o.cells.length;i++)
 {
 tr.style.backgroundColor="white"
 tr.onmouseout=function(){this.bgColor="white"}
 tr.onmouseover=function(){this.bgColor="#efffff"}
 tr.onclick=function(){add2(this)}
 tr.onclick=function(){add(this)}
 tr.insertCell(i).innerHTML=o.cells(i).innerHTML
 }
 tab2.deleteRow(o.rowIndex)
 
}

</script>

<html>
<head>
<title>财务收、支日报表</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link href="../css.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/JavaScript">
<!--

 

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
}
//-->
</script>
</head>
<body bgcolor="F5F5F5" leftmargin="0" topmargin="0">
<form name="form1" method="post" action="">
  <table width="98%" border="0" align="center" cellpadding="4" cellspacing="4">
    <tr>
      <td> <table width='100%' border='0' cellspacing='4' cellpadding='4'>
          <tr align='center'>
            <td colspan='3'><font size='5'><strong>医生业绩表</strong></font></td>
          </tr>
          <tr>
            <td width='35%'> <font color='#FF0000'>[Ctrl+Enter 新增行]</font></td>
            <td width='40%'>机构名称:
              <input name='OrganizationName' type='text' class='line1_input'  readonly='true' value=''>
            </td>
            <td width='34%' align='right'>单位金额:元</td>
          </tr>
        </table>
        <table width='100%' border='0' cellpadding='3' cellspacing='2' bgcolor='#000000' >
          <tr>
            <td valign='top' bgcolor='#FFFFFF'> <table height='100%' width='100%' border='0' cellpadding='1' cellspacing='1'>
                <tr>
                  <td valign='top'> <table id='DataTable' width='100%' border='0' cellpadding='2' cellspacing='1' bgcolor='#000000'>
                      <tr align='center' bgcolor='#E6E6E6'>
                        <td width='100' height='28' rowspan='2' bgcolor='#E6E6E6'>科室</td>
                        <td width='60' rowspan='2' bgcolor='#E6E6E6'>医生</td>
4000
;
                        <td width='60' rowspan='2' bgcolor='#E6E6E6'>初诊人数</td>
                        <td width='60' rowspan='2' bgcolor='#E6E6E6'>复诊人数</td>
                        <td colspan='2'>治疗人数</td>
                        <td height='21' colspan='4'>营业收入</td>
                        <td colspan='2'>处方量</td>
                      </tr>
                      <tr align='center' bgcolor='#E6E6E6'>
                        <td width='35' bgcolor='#F7F7F7' align='center'>初诊</td>
                        <td width='35' bgcolor='#F7F7F7' align='center'>复诊</td>
                        <td width='35' bgcolor='#F7F7F7' align='center'>检验</td>
                        <td width='35' bgcolor='#F7F7F7' align='center'>治疗</td>
                        <td width='35' bgcolor='#F7F7F7' align='center'>手术</td>
                        <td width='35' bgcolor='#F7F7F7' align='center'>X光</td>
                        <td width='60' bgcolor='#F7F7F7'>数量</td>
                        <td width='60' bgcolor='#F7F7F7'>金额</td>
                      </tr>
                      <tr id='DataTr' align='center' bgcolor='#FFFFFF'>
                        <td height='28'> <select name='0SectionOfficeID'>
                            <option value=''>请选择</option>
                            <option value='15'>妇科</option>
                            <option value='16'>不孕不育科</option>
                            <option value='17'>儿科</option>
                          </select> </td>
                        <td> <input name='0Doctor' type='text' class='line_input' size='8' onmouseover='this.focus()'>
                        </td>
                        <td> <input name='0FirstDiagnose' type='text' class='line_input' size='6' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;'>
                        </td>
                        <td> <input name='0SecondDiagnose' type='text' class='line_input' size='6' value='' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;'>
                        </td>
                        <td> <input name='0FirstTreatmented' type='text' class='line_input' size='4' value='' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;'>
                        </td>
                        <td> <input name='SecondTreatmented' type='text' class='line_input' size='4' value='' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;'>
                        </td>
                        <td> <input name='0IncomeItem7' type='text' class='money_input' size='4' value='' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;' onKeyUp="GetIncomeSum('0IncomeItem');"></td>
                        <td> <input name='0IncomeItem8' type='text' class='money_input' size='4' value='' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;' onKeyUp="GetIncomeSum('0IncomeItem');"></td>
                        <td> <input name='0IncomeItem19' type='text' class='money_input' size='4' value='' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;' onKeyUp="GetIncomeSum('0IncomeItem');"></td>
                        <td> <input name='0IncomeItem20' type='text' class='money_input' size='4' value='' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;' onKeyUp="GetIncomeSum('0IncomeItem');"></td>
                        <td> <input name='0RecipeAmonut' type='text' class='line_input' size='8' value='' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;'>
                        </td>
                        <td> <input name='0IncomeItemSum' type='text' class='money_input' size='8' value='' onmouseover='this.focus()' onKeypress='javascript:if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;' readonly='true'>
                        </td>
                      </tr>
                    </table></td>
                </tr>
              </table></td>
          </tr>
        </table>
        <table width='100%' border='0' cellspacing='2' cellpadding='2'>
          <tr>
            <td width='60%'>说明:处方收入合计=营于收入合计</td>
            <td width='20%'>制表:
              <input name='CreatedTable' type='text' class='line1_input' id='CreatedTable2' size='8' onmouseover='this.focus()'>
            </td>
            <td width='22%' align='right'>填表日期:
              <input name='CreatedDate' type='text' class='line1_input' id='CreatedDate3' value='2004-07-10' size='10' readonly='true'>
            </td>
            <td width='1%' align='left'>
              <input type='hidden' name='Action2' value='Submit'> </td>
          </tr>
        </table></td>
    </tr>
  </table>
  <div align="center">
    <input name="button" type="button" onclick="View()" value="表格信息">
  </div>
</form>
</body>
</html>
<script language="JavaScript">
function GetIncomeSum(obj){
   var IncomeSum=0
   for(i=0;i<document.all.tags("input").length;i++){
      var TagName=document.all.tags("input").name.toString()
      if (TagName.indexOf(obj)!=-1){
             var Income=(document.all.tags("input").name!=obj+"Sum"?document.all.tags("input").value:0)
             IncomeSum=eval(IncomeSum)+eval((Income==""?0:Income))
      }
   }
   document.all(obj+"Sum").value=IncomeSum
   //setTimeout("GetIncomeSum('"+obj+"')",1000);

}

function Check(){
   if (form1.SectionOfficeID.value==""){
      alert("请选择一个科室!");
          form1.SectionOfficeID.focus();
          return false;
   }

   if (form1.Doctor.value==""){
      alert("医生名称不能为空!");
          form1.Doctor.focus();
          return false;
   }

   if (form1.FirstDiagnose.value==""){
      alert("初诊人数不能为空!");
          form1.FirstDiagnose.focus();
          return false;
   }

   if (form1.SecondDiagnose.value==""){
      alert("复诊人数不能为空!");
      form1.SecondDiagnose.focus();
          return false;
   }

   if (form1.FirstTreatmented.value==""){
      alert("初诊治疗人数不能为空!");
          form1.FirstTreatmented.focus();
          return false;
   }

   if (form1.SecondTreatmented.value==""){
      alert("复诊治疗人数不能为空!");
          form1.SecondTreatmented.focus();
          return false;
   }

   if (form1.RecipeAmonut.value==""){
      alert("处方数量不能为空!");
          form1.RecipeAmonut.focus();
          return false;
   }

   if (form1.IncomeItemSum.value==""){
      alert("金额不能为空!");
          form1.IncomeItemSum.focus();
          return false;
   }

   form1.submit()
}

i=1;
function Addrow(){
   /*var i=2;
   var row = DataTable.insertRow(i+1)
   var cell = row.insertCell(0)
   cell.innerHTML="jowing test"
   row.style.backgroundColor="#FFFFFF"
   cell = row.insertCell(1)
   cell.innerHTML="<input name='Doctor' type='text' class='line_input' size='8' onmouseover='this.focus()'>"
   row.style.backgroundColor="#FFFFFF"
   */

   var newTR = DataTr.cloneNode(true);
   newTR.id="a"+(++i)
   DataTr.parentNode.insertAdjacentElement("beforeEnd",newTR);

   RowReset()

}

function RowReset(){
   var RowCount=DataTable.rows.length-1
   var ReName=RowCount-2
   for (var i=0;i<DataTable.rows[RowCount].cells.length;i++){
     
      var str=DataTable.rows[RowCount].cells.innerHTML
      str=(str.replace(/name=[/d]*/i,"name="+ReName)).replace(/value=[/w]*/i,"value=''").replace(/(GetIncomeSum)/(/'0/i,"GetIncomeSum('"+ReName);
      DataTable.rows[RowCount].cells.innerHTML=str
   }
}

function View(){

  for (var r=1;r<DataTable.rows.length;r++){
     for (var c=0;c<DataTable.rows[r].cells.length;c++){
        alert(DataTable.rows[r].cells[c].innerHTML)
     }
  }
}

function ShortcutKey(){
if((event.ctrlKey)&&(window.event.keyCode==13))
    Addrow()
}

document.onkeydown=ShortcutKey;
</script>
 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息