为什么我无法将数据传输到另一个HTML页面
为什么我无法将数据传输到另一个HTML页面
提问于 2018-07-23 04:22:46
我完全意识到有几十个问题伴随着这个问题，但我觉得我的方案有点不同(由你决定)，我正在尝试将表单数据从1HTML(test.html)转移到另一个HTML(tut1.html)
基本上，我试图做的是提取数据，并在我遇到的另一个modal.The问题中显示，我在测试运行中设法做了同样的事情，但由于某些原因，当我将它添加到我的主程序中时，它并不真正起作用。我确信我遗漏了一些小东西，但我不能用别针把它别住。解决这个问题的任何帮助都将是非常有帮助的。(你可以注意到的一件事是，在测试运行中，我使用了一个按钮来提交，但在这里，我使用了一个href.not，以确定这是否是导致这个问题的原因。我还注意到，由于href的链接，页面被重定向到第二个页面，而不是因为表单操作)。
HTML1包含用户输入的form.Where。
<html>
<head>
</head>
<body>
<div class="feedback-background">
<div class="feedback-content">
<div class="close">+</div>
<img src="E:\IIT\Lectures\WEB\coursework1\Images\feedbackimg1.jpg" alt="Givefeedback" style="width:100px;height:100px;">
<form name="FeedbackForm" method="get">
Name:
<input id="Name" name="N" type="text" placeholder="Name">
E-Mail:
<input id="E-mail" name="E-mail" type="email" placeholder="E-mail">
What do you think about us?<br>
<textarea id="comment" rows="6" cols="33" name="C"></textarea>
<br>
How would you rate us ?
<br>
<label><input type ="radio" name="rating" id="rating" value="Excellent" checked>Excellent</label>
<label><input type ="radio" name="rating" id="rating" value="Very Good">Very Good</label>
<label><input type ="radio" name="rating" id="rating" value="Average">Average</label>
<label><input type ="radio" name="rating" id="rating" value="Poor">Poor</label>
<label><input type ="radio" name="rating"id="rating" value="Extreamly Poor">Extremely Poor</label>
<br>
<a href="tut1.html" onClick="testJS()" id="submit" type="submit">SUBMIT</a>
</form>
</div>
</div>
<script>
function testJS() {
var b = document.getElementById('Name').value,
document.getElementById('comment').value,
url = 'http://E:\IIT\Homework\web1t/tut1.html?Name=' + encodeURIComponent(b);
document.location.href = url;
}
</script>
</body>
HTML2 (tut1.html)包含了我创建的一个模式(不包括css )
<body>
<div class="popup">
<div class="popuptext" id="myPopup"><p>Thank you <span id="username"></span> ,<br>Your feedback has been recorded.<br>
<br>You commented that"<span id="usercomment"></span>" <br><br>and rated our website "<span id="userrating"></span>".
<br><br>Thank you
for taking your time to do so.<br><br>You will now be re-directed automatically</p>
</div>
</div>
<script>
window.onload = function () {
var url = document.location.href,
params = url.split('?')[1].split('&'),
data = {}, tmp;
for (var i = 0, l = params.length; i < l; i++) {
tmp = params[i].split('=');
data[tmp[0]] = tmp[1];
}
document.getElementById('username').innerHTML = data.N;
document.getElementById('usercomment').innerHTML = data.C;
}
</script>
</body>PS:我使用了精确的2个代码来填写另一个表单，但它非常简单，它完美地工作，不知道为什么它不能在这里工作。任何形式的帮助都是非常有帮助的。
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-07-23 16:03:18
你的代码应该有一个错误输出，但是你不知何故没有使用调试工具。我想这对你来说是个好机会。
首先，请更改'a标签href'，如'# tut1.html '，然后单击它，我认为您不会转换到tut1.html。另外，当你转换到'tut1.html‘的时候，url和你想要的一样吗？
让我们试试这个。
'<a href="tut1.html"~' → '<a href="#tut1.html~'
(Off course, e.preventDefault is also fine.)并更新testJS函数。
function testJS() {
// There was syntax error. and the value format is "?name=value&name=value" usually.
var b = document.getElementById('Name').value,
c = document.getElementById('comment').value,
url = 'http://E:\IIT\Homework\web1t/tut1.html?Name='+ encodeURIComponent(b) + '&Comment=' + encodeURIComponent(c);
// if you don't use debugging tool, at least put an alert.
alert(url);
document.location.href = url;
}tut1.html也需要更新。
window.onload = function () {
var url = document.location.href,
params = url.split('?')[1].split('&'),
data = {}, tmp;
for (var i = 0, l = params.length; i < l; i++) {
tmp = params[i].split('=');
data[tmp[0]] = tmp[1];
}
// the name is wrong; you set name Name and Comment, when you create the url.
document.getElementById('username').innerHTML = data.Name;
document.getElementById('usercomment').innerHTML = data.Comment;
}供你参考。第一个页面的操作与您简单使用的操作相同
<form action='tut1.html' method='get'>
+
<input type="submit" value="submit">在这种情况下，发送的参数使用它的名称和值。(？N=xxxx&C=yyyy)除非有特殊原因，否则您不需要自己创建包含参数的url。
Stack Overflow用户
发布于 2018-07-23 04:43:47
只需在testJS函数中添加一个preventDefault，如下所示
function testJS(e) {
e.preventDefault();
var b = document.getElementById('Name').value,
document.getElementById('comment').value,
url = 'http://E:\IIT\Homework\web1t/tut1.html?Name=' + encodeURIComponent(b);
document.location.href = url;
}因为您正在手动设置url，所以您必须防止默认的a标记行为。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51468963
复制相关文章
相似问题