jsダイナミック操作注文表

6708 ワード
js。
js动态操作订单表格
js动态操作订单表格
<!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{

    font-size:13px;

    line-height:25px;

    }

table{

    border-top: 1px solid #333;

    border-left: 1px solid #333;

    width:400px;

}

td{

    border-right: 1px solid #333;

    border-bottom: 1px solid #333;

    text-align:center;

    }

.title{    

    font-weight:bold;

    background-color: #cccccc;

}

input text{

    width:100px;

}

      

</style>

<script type="text/javascript">



function addRow(){

   var addTable=document.getElementById("order");

   var row_index=addTable.rows.length-1;       //           

   var newRow=addTable.insertRow(row_index);  //    

   newRow.id="row"+row_index;                 //       ID

   

   var col1=newRow.insertCell(0);

   col1.innerHTML="        ";

   

   var col2=newRow.insertCell(1);

   col2.innerHTML=row_index;

   

   var col3=newRow.insertCell(2);

   col3.innerHTML="&yen;49.00";

   

   var col4=newRow.insertCell(3);

   col4.innerHTML="<input name='del"+row_index+"' type='button' value='  ' onclick=\"delRow('row"+row_index+ "')\" />&nbsp;<input id='edit"+row_index+"' type='button' value='  ' onclick=\"editRow('row"+row_index+ "')\" />";



    }

    

function delRow(rowId){

    var row=document.getElementById(rowId).rowIndex;   //           

    document.getElementById("order").deleteRow(row); 

    }

    

function editRow(rowId){

    var row=document.getElementById(rowId).rowIndex;   //           

    var col=document.getElementById(rowId).cells;

    var text=col[1].innerHTML;

    col[1].innerHTML="<input name='num"+row+"' style='width:40px;' type='text' value='"+text+"' />";

    col[3].lastChild.value="  ";

    col[3].lastChild.setAttribute("onclick","upRow('"+rowId+ "')");

    

    /*col[3].innerHTML="<input name='del"+row+"' type='button' value='  ' onclick=\"delRow('"+rowId+ "')\" />&nbsp;<input id='edit"+row+"' type='button' value='  ' onclick=\"upRow('"+rowId+ "')\" />"    */

    }

    

function upRow(rowId){

    var row=document.getElementById(rowId).rowIndex;   //           

    var col=document.getElementById(rowId).cells;

    var text=col[1].firstChild.value;

    col[1].innerHTML=text;

    

    col[3].lastChild.value="  ";

    col[3].lastChild.setAttribute("onclick","editRow('"+rowId+ "')");





/*col[3].innerHTML="<input name='del"+row+"' type='button' value='  ' onclick=\"delRow('"+rowId+ "')\" />&nbsp;<input id='edit"+row+"' type='button' value='  ' onclick=\"editRow('"+rowId+ "')\" />"*/    

    

    

    }

</script>

</head>



<body>

<table border="0" cellspacing="0" cellpadding="0" id="order">

  <tr class="title">

    <td>    </td>

    <td>  </td>

    <td>  </td>

    <td>  </td>

  </tr>

  <tr id="del1">

    <td>       </td>

    <td>12</td>

    <td>&yen;568.50</td>

    <td><input name="rowdel" type="button" value="  " onclick='delRow("del1")' />

    <input id="edit1" type="button" value="  " onclick='editRow("del1")' /></td>

  </tr>

  <tr>

    <td colspan="4" style="height:30px;">

    <input name="addOrder" type="button" value="    " onclick="addRow()" /></td>

  </tr>

</table>

</body>

</html>
Leetcodeビット演算Single Number
javascriptでstring変換UTF 8フォーマットbyte配列