动态添加删除上传图片标签

<script type="text/javascript">
	var Browser = new Object();
	Browser.isIE = window.ActiveXObject ? true : false;
	//获取行数
	function rowindex(tr)
	{
	  if (Browser.isIE)
	  {
	    return tr.rowIndex;
	  }
	  else
	  {
	    table = tr.parentNode.parentNode;
	    for (i = 0; i < table.rows.length; i ++ )
	    {
	      if (table.rows[i] == tr)
	      {
	        return i;
	      }
	    }
	  }
	}
//添加input
function addImg(obj)
{
  var src  = obj.parentNode.parentNode;
  var idx  = rowindex(src);
  var tbl  = document.getElementById('gallery-table');
  var row  = tbl.insertRow(idx + 1);
  var cell = row.insertCell(-1);
  cell.innerHTML = src.cells[0].innerHTML.replace(/(.*)(addImg)(.*)(\[)(\+)/i, "$1removeImg$3$4-");
}
//删除input
function removeImg(obj)
{
  var row = rowindex(obj.parentNode.parentNode);
  var tbl = document.getElementById('gallery-table');
  tbl.deleteRow(row);
}
</script>
  
  
<body>
	<table width="90%" id="gallery-table" align="center">
	  <tbody>
	  <tr><td></td></tr>
	  <tr><td>&nbsp;</td></tr>
	  <tr>
	    <td>
	      <a href="javascript:;" onclick="addImg(this)">[+]</a>
	      图片描述 <input type="text" name="img_desc[]" size="20"/>
	      上传文件 <input type="file" name="img_url[]"/>
	    </td>
	  </tr>
	</tbody>
	</table>
  </body>
</html>

猜你喜欢

转载自422979391.iteye.com/blog/2262504