我有一个由 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() 信息。我希望它在现有页面上添加另一行，以便我可以上传多张图片。
最佳答案
当网页已包含内容时，document.write 将覆盖该内容。
您应该使用 innerHTML 将文本插入到 DOM 中属性(property)。这是一个例子；
var div = document.createElement('div');
div.innerHTML = 'My content';
document.appendChild(div);
关于Javascript document.write() 指向另一个页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18935621/