如何使用 HTML 表单将 JavaScript 值传递到另一个 PHP 页面?

Posted

技术标签:

【中文标题】如何使用 HTML 表单将 JavaScript 值传递到另一个 PHP 页面?【英文标题】:How can I pass JavaScript values to another PHP page using an HTML form? 【发布时间】:2012-12-31 16:37:44 【问题描述】:

我花了两个多月的时间来解决这个编码问题。首先我知道 javascript 运行在客户端,php 运行在服务器端。

我有两个 PHP 页面(index23.php 和 index24.php),都使用 html/PHP 和 JS。

我正在使用 HTML5 地理定位 API:

<body onload="getLocation()">

<p id="demo"></p>

<script>
var x = document.getElementById("demo");

function getLocation()

    if (navigator.geolocation)
    
        navigator.geolocation.getCurrentPosition(showPosition);
    
    else
    
        x.innerHTML="Geolocation is not supported by this browser.";
    


function showPosition(position)

    x.innerHTML= "+" + position.coords.latitude + "+" + position.coords.longitude;  

</script>

我可以在我当前的 PHP 页面 (index23.php) 上看到地理编码值。然后我单击一个 HTML 表单按钮,浏览器转到另一个页面 (index24.php)。

如何使用表单上的提交按钮将第一个 PHP 页面上的 JavaScript 值传递到第二个 PHP 页面?

这是我的表格:

<form id="searchbox" action="index24.php" method="get">
<input name="q" type="text" placeholder="Type here"/>
<input id="submit" type="submit" value="Search"></form>

【问题讨论】:

【参考方案1】:

您需要做的是隐藏输入类型并通过它发送值

<input name="bla"  type="hidden" value="blabla"> 

html 也不是服务器端.. 只有 php 是。我希望下面的图片能解释一下

image source

【讨论】:

喜欢图片:D【参考方案2】:

index23.php:

<html>
<head>
<script type="text/javascript">
function getLocation()
    var x = document.getElementById("demo");
    if (navigator.geolocation)
        navigator.geolocation.getCurrentPosition(showPosition);
    else
        x.innerHTML="Geolocation is not supported by this browser.";
    

function showPosition(position)
    var x = document.getElementById("demo"),latitude=document.getElementById("latitude"),longitude=document.getElementById("longitude");
    x.innerHTML="+" + position.coords.latitude + "+" + position.coords.longitude;
    latitude.value = position.coords.latitude;
    longitude.value = position.coords.longitude;


</script>

</head>
<body onload="getLocation()">

    <p id="demo"></p>
    <form id="searchbox" action="index24.php" method="get">
    <input name="q" type="text" placeholder="Type here"/>
    <input name="latitude" id="latitude" type="hidden">
    <input name="longitude" id="longitude" type="hidden">
    <input id="submit" type="submit" value="Search"></form>
</body></html>

index24.php

$latitude = $_GET['latitude'];
$longitude = $_GET['longitude'];

【讨论】:

您必须切换到$_POST 方法才能使其不显示在 URL 中【参考方案3】:

您可以在获取坐标时将值动态添加到表单中。

<form id="searchbox" action="index24.php" method="get">
<input name="q" type="text" placeholder="Type here"/>
<input id="submit" type="submit" value="Search">
<input name="latitude" type="hidden" id="latitude" value="" />
<input name="longitude" type="hidden" id="longitude" value="" />
</form>
<script>
var x=document.getElementById("demo");
function getLocation()

  if (navigator.geolocation)
  
    navigator.geolocation.getCurrentPosition(showPosition);
  
  elsex.innerHTML="Geolocation is not supported by this browser.";

function showPosition(position)

  document.getElementById('latitude').value = position.coords.latitude;
  document.getElementById('longitude').value = position.coords.longitude;
  x.innerHTML="+" + position.coords.latitude + "+" + position.coords.longitude;    

</script>

【讨论】:

以上是关于如何使用 HTML 表单将 JavaScript 值传递到另一个 PHP 页面?的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 javascript 或 jquery 将 html 表单数据保存到 sql db [关闭]

如何使用 HTML 表单将 JavaScript 值传递到另一个 PHP 页面?

如何将变量从外部 JavaScript 传递到 HTML 表单

将 HTML 表单数据提交到 javascript [关闭]

如何使用Javascript表单元素填充html表?

如何使用javascript将表单数据附加并保存到txt文件