PHP中如何利用innerHTML增加多个INPUT标签,并在保存后如果读取添加的多个input标签值并对其值进行编辑

PHP中如何利用innerHTML增加多个INPUT标签,并在保存后如果读取添加的多个input标签值并对其值进行编辑,第1张

这是innerHTML的一种使用方式,我还设想过另一种,但没成品。有时间的时候我会研究下。请看下方这个上传文件对input 框的处理方式:

<!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/htmlcharset=utf-8" />

<title>无标题文档</title>

</head>

<?php

if(!$_FILES['imgfile']){

//ShowMsg("图片选择不能为空!",-1,0)

//exit()

}

$img_dir = "../hhy_img/"

// …… html 显示上传界面

$uploaded = 0

$unuploaded = 0

//只允许20张图片上传

for ($i=0$i<=20$i++)

{

//获取当前图片的信息

$is_file = $_FILES['imgfile']['name'][$i]

//如果当前图片不为空

if (!empty($is_file))

{

//把当前图片的信息存储到变量里

$result[$i] = "

<tr class=td2 align=center>

<td>". $_FILES['imgfile']['name'][$i] ."</td>

<td>". round($_FILES['imgfile']['size'][$i]/1024, 2) ."K</td>

<td>". $_FILES['imgfile']['type'][$i] ."</td>

<td>"

// 判断上传的图片的类型是不是jpg,gif,png,bmp中的一种,同时判断是否上传成功

if (

$_FILES['imgfile']['type'][$i] == "image/pjpeg" ||

$_FILES['imgfile']['type'][$i] == "image/gif" ||

$_FILES['imgfile']['type'][$i] == "image/x-png" ||

$_FILES['imgfile']['type'][$i] == "image/bmp"

)

{

//如果上传的文件没有在服务器上存在

if (!file_exists($img_dir . $_FILES['imgfile']['name'][$i]))

{

//把图片文件从临时文件夹中转移到我们指定上传的目录中

move_uploaded_file($_FILES['imgfile']['tmp_name'][$i], $img_dir . $_FILES['imgfile']['name'][$i])

$result[$i] .= "成功"

$db->query("INSERT INTO itempic (path,itemid) VALUES (‘/upload/".$_FILES['imgfile']['name'][$i]."‘,".$_POST['itemid'].")")

$uploaded++

}

else //如果文件已经在服务器上存在

{

$result[$i] .= "<font color=red>文件已存在</font>"

$unuploaded++

continue

}

}

else

{

$result[$i] .= "<font color=red>失败</font>"

$unuploaded++

}

$result[$i] .= "</td></tr>"

} //end if

} // end for

// 如果没有选择任何图片

if (empty($result))

{

echo"错误信息,没有选择任何图片。"

exit()

}

// 显示所有上传后的结果

echo " <table cellpadding=4 cellspacing=1 border=0 class=table width=400 align=left>

<tr class=navi align=center>

<td>文件名</td>

<td>大小</td>

<td>类型</td>

<td>上传结果</td>

</tr>

"

foreach( $result as $value)

{

echo $value

}

echo "<tr class=td1>

<td colspan=4>共上传 " . ($uploaded + $unuploaded) . ", 成功: $uploaded, 失败:<font color=red>$unuploaded</font></td>

</tr>

<tr class=navi>

<td colspan=4 align=center>[ <a href='?action=addpic' title='继续上传'>继续上传</a>]     </td>

</tr>

</table>

"

?>

<body>

<form action="?action=uppic" enctype="multipart/form-data" method="post" name="Form1" id="Form1">

<SCRIPT language="javascript">

function tbladdrow()

{

var i=lines.rows.length

var row = Table1.insertRow(Table1.rows.length)

var col = row.insertCell(0)

col.innerHTML = "<INPUT class='inputbut' id=imgfile["+i+"] type='file' name=imgfile["+i+"] size='50'>"

}

function tbladdrows(items)

{

for( i = 1 i <= items i++)

{

tbladdrow()

}

}

function delrow()

{

if(lines.rows.length==0)

{

return false

}

lines.deleteRow()

}

</SCRIPT>

<table width="100%" border="0" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC" id="from">

<tbody>

<tr>

<td height="28" bgcolor="#FFFFFF"></td>

<td align="left" bgcolor="#FFFFFF">

<TABLE id=Table1 cellpadding="3" cellspacing="0" width="60%">

<tbody id="lines" name="lines">

</tbody>

</TABLE>

<INPUT id="addrow" name="addrow" type="button" value="加一张" onclick="tbladdrows(3)" class="inputbut" >

<INPUT id="DelOneLine" name="DelOneLine" type="button" class="inputbut" value="删一张" LANGUAGE=javascript onclick="return delrow()">

</td>

<tr>

<td colspan="2" align="left" bgcolor="#FFFFFF"><input name="Submit" value=" 上传图片 " type="submit" class="inputbut" /></td>

</tr>

</tbody>

</table>

</form>

</body>

</html>

public static String subStr(String str, int length) throws RuntimeException{

if(str==null){

throw new NullPointerException("字符串为null")

}

int len = str.length()

if(len<Math.abs(length)){

throw new StringIndexOutOfBoundsException("最大长度为"+len+",索引超出范围为:"+(len-Math.abs(length)))

}

if(length>=0){

return subStr(str, 0,length)

}else{

return subStr(str, len-Math.abs(length), len)

}

}


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/7924237.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-11
下一篇 2023-04-11

发表评论

登录后才能评论

评论列表(0条)

保存