Javascript document.write()重定向到另一个页面

时间:2013-09-21 17:43:06

标签: javascript php document.write

我有一个由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()信息。我希望它在现有页面中添加另一行,以便我可以上传多张图片。

1 个答案:

答案 0 :(得分:3)

当网页已包含内容时,document.write会覆盖该内容。

您应该使用innerHTML属性向DOM插入文本。这是一个例子;

var div = document.createElement('div');
div.innerHTML = 'My content';
document.appendChild(div);