jquery 표 줄 동적 삭제 실현

3453 단어 jquery
<script src="jquery-1.5.1.min.js"></script>

<script>

	$("document").ready(function(){

		var tr;//           

		//       

		$("input#add").click(function(){

			//        ,      ,   ,       

			if(tr==null)

				$("#detail").clone().appendTo($("#mytable"));

			else

				tr.clone().appendTo($("#mytable"));

		});

		//        

		$(":checkbox#all").click(function(){

			$("input[type=checkbox]").attr("checked",$("input#all").attr("checked"));

		});

		//         

		$(":button#btnDel").click(function(){

			tr=$("#detail").clone();//       ,          

			$("input:checked[id!=all]").parent().parent().remove();	//     ,       						   

		});

	});

</script>

 
 
<input type="button" id="add" value="    " />

    <input type="button" id="btnDel" value="    " />

  <br />

  <br />

    	<table width="650" border="0" id="mytable">

        <tr align="center">

    	    <td width="34" align="left"><input type="checkbox" id="all" /></td>

    	    <td width="113" align="center">  </td>

    	    <td width="75" align="center">  </td>

    	    <td width="80" align="center">  </td>

    	    <td width="76" align="center">  </td>

    	    <td width="83" align="center">    </td>

    	    <td width="74" align="center">    </td>

    	    <td width="81" align="center">    </td>

        </tr>

        <tr id="detail">

        	<td width="34"><input type="checkbox"/></td>

            <td width="113"><input name="medicineName" type="text" size="15"/></td>

            <td width="75"><input name="type" type="text" size="10"/></td>

            <td width="80"><input name="amount" type="text" size="10"/></td>

            <td width="76"><input name="price" type="text" size="10"/></td>

            <td width="83"><input name="productionTime" type="text" size="10"/></td>

            <td width="74"><input name="produtionBatch" type="text" size="8"/></td>

          <td width="81"><input name="expires" type="text" size="10"/></td>

        </tr>

  	  </table>

좋은 웹페이지 즐겨찾기