« »

Bạn có thể dùng đoạn mã JavaScript này để tạo các bảng theo mục đích của mình. Bạn có thể kết hợp với các hiệu ứng khác để làm cho bảng tạo ra trông thân thiện và bắt mắt hơn.

Nhãn: Tạo bảng

For the best in Cable TV, High Speed Internet & Home Phone Service order Comcast Deals and save money.

Báo cho chúng tôi lỗi JavaScript này

Demo
Phóng to
Tải lại
Cửa sổ mới

Mã nguồn
CSS
JavaScript
HTML
In

Copy All x2

<STYLE>INPUT {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; OVERFLOW: hidden; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; BACKGROUND-COLOR: transparent
}
</STYLE>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->

Copy All x2

<SCRIPT>
lastrow =2 ; /* The number of the inital empty row, starting at 0. IE 0 for an table that starts with just one empty row. */
cols = 10; /* The number of colums in the table. */
function altrow(r)
{
   if (r == lastrow) /* If true, the last row has been changed, so add a new blank row. */
   {
      newrow = document.all.dyntab.insertRow();
      newrow.setAttribute("id", "tr" + ++lastrow);
      for (i = 0; i < cols; i++)
      {
         c = newrow.insertCell();
         c.insertAdjacentHTML("afterBegin", "<input type=text onChange=altrow(" + lastrow + ")>");
      }
   }
   else
   {
      /* We need a way to know what row is to be deleted: this is just one idea. */
      thisrow = document.getElementById("tr" + r).rowIndex;
      /* I did not bother naming the input fields, but they could be referenced by name instead. */
      for (i = 0; i < cols; i++)
      {
         if (document.forms[0].elements[cols * thisrow + i].value != "") /* If true, the line is not all blank. */
         {
            break;
         }
      }
      if (i == cols) /* If true the line was all blank, so delete the row. */
      {
         document.all.dyntab.deleteRow(thisrow);
      }
   }
}
</SCRIPT>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->

Copy All x2

<FORM>
<TABLE id=dyntab border=1>
  <TBODY>
  <TR id=tr0>
    <TD><INPUT onchange=altrow(0) value=Well size="20"></TD>
    <TD><INPUT onchange=altrow(0) value="Go on, try it." size="20"></TD></TR>
  <TR id=tr1>
    <TD><INPUT onchange=altrow(1) value="Go on." size="20"></TD>

    <TD><INPUT onchange=altrow(1) value="Why not?" size="20"></TD></TR>
  <TR id=tr2>
    <TD><INPUT onchange=altrow(2) size="20"></TD>
    <TD><INPUT onchange=altrow(2) size="20"></TD>
    </TR></TBODY></TABLE></FORM>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->