将HTML元素值传输到其他文件

时间:2015-08-04 16:29:53

标签: javascript html

假设我有来自 first.html

的这段代码
<input type="text" id="name">
<a href="second.html">Go to next page</a>

如何进入 second.html ,javascript会从 first.html 或 html在 first.html

中添加了一个h1标签,其值为[name]

2 个答案:

答案 0 :(得分:0)

你可以在锚标签上使用onclick功能。

<input type="text" id="name">
<a onclick="goToNextPage()">Go to next page</a>
<script>
function goToNextPage()
{
var value = document.getElementById('name').value;
 window.location.href="second.html?name="+value;
}
</script>

或者您可以使用form.submit()将表单值发布到请求中。

由于HTML只是标记语言,而不是编程语言。所以,你需要php / javascript来获取第二页上的那个值。

function qs(search_for) {
        var query = window.location.search.substring(1);
        var parms = query.split('&');
        for (var i=0; i<parms.length; i++) {
            var pos = parms[i].indexOf('=');
            if (pos > 0  && search_for == parms[i].substring(0,pos)) {
                return parms[i].substring(pos+1);;
            }
        }
        return "";
    }

然后在第二页中调用该函数。

    <script type="text/javascript">
  document.write(qs("name"));
</script>

答案 1 :(得分:0)

您可以使用document.getElementById()函数获取输入并访问它的value属性以阅读其中输入的内容。

锚元素上的onclick属性将执行自定义函数,该函数将获取锚点的href属性并附加输入字段的url编码值。

然后它将转到该新网址。

return false确保内置的href事件不会执行。

&#13;
&#13;
function link(anchor) {
  var name = document.getElementById("name").value
  var url = anchor.href + "?name=" + encodeURIComponent(name);
  window.location.href = url;
}
&#13;
<input type="text" id="name">
<a href="second.html" onclick="link(this); return false;">Go to next page</a>
&#13;
&#13;
&#13;

要在接收页面上读取传入的变量,请使用此SO帖子中描述的技术:

How can I get query string values in JavaScript?