js実現

2041 ワード

 
 1、javascriptを使って奇/偶行の色の交替を実現する:
   
function formatTable()
	{
                                var oTable = document.getElementById('oTable');//  table  
		var rows=oTable.rows;
		for(var i=0;i<rows.length;i++)
		{
			if(i%2==0) {
				rows[i].style.backgroundColor = "#FFFFFF";
				rows[i].style.color = "#000000";
			} else {
				rows[i].style.backgroundColor = "#f7f7f7";
				rows[i].style.color = "#000000";
			}
		}
	}
 
2、javascriptダイナミック新規行
function createTr()
{
	var tab = document.getElementById("tab");
	var tr = tab.insertRow();//create tr
	//create td
	var td1 = tr.insertCell(0);
	td1.style.textAlign = "center";
	td1.innerHTML = '<img src="../imgs/bt_minus.gif" width="14" height="10" border="0" onclick="DelRow();" alt="  " class="mouseHand"/>';
	var td2 = tr.insertCell(1);
	td2.style.textAlign = "center";
	td2.innerHTML = '<input type="text" name="tel" size="13" value=""/>';
	var td3 = tr.insertCell(2);
	td3.style.textAlign = "center";
	td3.innerHTML = '<input type="text" name="code1" size="13"/>';
	var td4 = tr.insertCell(3);
	td4.style.textAlign = "center";
	td4.innerHTML = '<input type="text" name="address" size="48"/>';
	var td5 = tr.insertCell(4);
	td5.style.textAlign = "center";
	td5.innerHTML = '<input type="text" name="code2" size="13"/>';
	              
}
 
3、javascript動的に一行を削除する
 
function DelRow()
{
	var iIndex = window.event.srcElement.parentElement.parentElement.rowIndex;
	var tab = document.getElementById("tab");
	if(iIndex==-99999)
	  alert("    :      !");
	else{
		 tab.deleteRow(iIndex);
	}
	 
}