我有一个由PHP生成的页面
echo '
<html lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Story Submission Page</title>
<link rel="stylesheet" type="text/css" href="petercort.css" />
<script type="text/javascript" src="javascript.js">
</script>
</head>
';
echo '
<div id="submissionform">
<p><u><strong>Post Submission</strong></u></p>
<form action="upload_file.php" method="post" enctype="multipart/form-data">
<label for="title">Title: </label>
<input type="text" name="title" id="title"><br>
<br>
<label for="summary">Summary: [TXT FILE]</label>
<input type="file" name="summary" id="summary"><br>
<br>
<label for="story">Story: [TXT FILE]</label>
<input type="file" name="story" id="story"><br>
<br>
<label for="previewpicture">Preview Picture: [PNG FILE]</label>
<input type="file" name="previewpicture" id="previewpicture"><br>
<br>
<label for="contentpicture">Content Pic: [PNG File]</label>
<input type="file" name="contentpicture" id="contentpicture"><br>
<button onclick="addPictureLine()">Add Another Picture</button>
<br>
<input type="submit" name="submit" value="submit"><input type="reset" name="reset" value="reset">
</form>
</div>
</body>
</html>
';
}
}
else {
header('Location: adminpanel.html');
}
以及相关的javascript代码
function addPictureLine() {
document.write("<label for='contentpicture'>Content Pic: [PNG File]</label> <input type='file' name='contentpicture' id='contentpicture'><br>")
}
它可以工作,但当我点击按钮为用户添加另一行以向提交添加另一张图片时,请将我发送到一个空白页面,其中只包含document.write()信息。我希望它在现有页面中添加另一行,以便我可以上传多张图片。
答案 0 :(得分:3)
当网页已包含内容时,document.write
会覆盖该内容。
您应该使用innerHTML属性向DOM插入文本。这是一个例子;
var div = document.createElement('div');
div.innerHTML = 'My content';
document.appendChild(div);