Question

我有一个页面，用户输入地址并点击搜索。用户应该进入下一页，其中应包含一个谷歌地图，其中包含用户指定的地址。我应该如何将第1页上的表单中的地址传递给第2页上的js，我可以使用google maps api操作它？我正在使用codeigniter btw。

修改我理想的解决方案是使用flash数据或以url的方式传递codeigniter方式的地址。我的问题是，如果我使用其中任何一种方法，我不确定如何检索数据。

Answer 1

在第1页的CodeIgniter视图中：

<form method="POST" action="getMap">
<input type="text" name="address" value="" />
<input type="submit" value="Map It!" />
</form>

在由控制器的getMap（）方法加载的CodeIgniter视图中（换句话说，在第2页中）：

<script>
address = "<?php echo htmlspecialchars($this->input->post['address']); ?>";
// create the map with the address here
</script>

您需要注意对用户输入进行一些验证。

Answer 2

使用url变量来完成此任务。示例可能如下所示：

http://www.testurl.com/mappage.html?address=someaddress&city=somecity&state=ca&zip=12345

您可以在javascript中获取这些网址变量的值，并将其传递给Google地图。

Answer 3

如果您使用的是jquery，可以使用$ .cookie插件在PHP和Javascript之间传输信息。

或 2.每个$ _GET或$ _POST从1.页面发送数据并捕获2.页面中的数据

<script>

  var myData = '<?php=htmlspecialchars($_POST['data_from_page1']);?>';

</script>

Answer 4

您希望用户能够保存网址吗？

如果你不这样做，只需在输入字段中使用POST并以这种方式在第二页中检索数据（在javascript中）：

var address = '<?=$this->input->post('address')?>'

否则：

在javascript中，在第一页中，阻止表单提交上的默认操作，而是将用户重定向到[第二页的url] / [表单中写的东西]（如果你想要，我可以给你一个jquery示例）;
在第二页控制器中（让我们假装该函数被称为get_map并且它在maps控制器中以这种方式获取数据
```
function get_map($address = null)
```
现在你有了输入地址。将其传递给应包含地图的视图。

Answer 5

为什么不使用Javascript文字语法在目标页面上通过PHP打印POSTed信息？例如，如果您的表单POST以下（GET或POST查询）：

firstname=aaron&lastname=pink

您可以在目的地PHP页面中打印：

<html>
  <head>
    <script type="text/javascript">
      var fname = "<?php echo addslashes($_POST['firstname']); ?>";
      var lname = "<?php echo addslashes($_POST['lastname']); ?>";
    </script>
  </head>
  <body>
    ...
    <button onclick="alert(fname);">Say First Name!</button>
  </body>
</html>

然后，您可以根据需要简单地使用fname和lname Javascript变量，就像我的示例按钮点击一样！

我希望它有用，即使很简单：）

Answer 6

@Catfish你会感到困惑。让你的网址“漂亮”并让它们类似路径/文件而不是查询字符串的目的是为了SEO＆amp;用户友好性。您不应该将任何表单输入包含在“漂亮”的URL中。通过$ _POSTS全局发送您的地址数据或将其作为查询字符串发送。 CI在htaccess文件的mod_rewrite定义中使用[QSA]标志，因此您可以完全依赖于（IMO）语义上正确的查询字符串。

无论如何，代码。

在form.php上：

<form action="map.php" method="get">
<input type="text" name="addr" />
</form>

在map.php上：

<?php
$addr = $this->input->get('addr');
// or $addr = $_GET['addr'];

echo $addr;
?>

Answer 7

您可以在现代浏览器上使用sessionStorage在同一浏览会话中的页面之间存储数据。对于较旧的浏览器，您可以使用hacky解决方案，允许您在window.name

中存储数据

if( typeof sessionStorage !== 'undefined' ){
  myStorage = sessionStorage;
}else{
  myStorage = {
    setItem:function(key,val){
      this.removeItem(key);
      window.top.name+=(window.top.name.length?'&':'')+escape(key)+'='+escape(val);
    }
    ,getItem:function(key){
      var r = window.top.name.match(new RegExp('(^|&)'+escape(key)+'=([^&=]*)($|&)'));
      return r?unescape(r[2]):null;
    }
    ,removeItem:function(key){
      window.top.name = window.top.name.replace(new RegExp('(^|&)'+escape(key)+'=([^=&]*)(?=$|&)'),'');
    }
  };
}

现在，您可以对要保留的每个表单字段使用myStorage.setItem('key',value)，并使用myStorage.getItem('key')

在下一页上检索它们

它并不比使用cookie复杂，并且不会在每个请求标头中传输cookie数据。

希望这有帮助..

Answer 8

为什么不使用Google Maps API完全使用JavaScript？假设您的地图已使用变量var Map和var Geocoder中的地理编码器进行初始化，并且您拥有<form id="searchForm">Address:<input /> <br /> <input type="submit" /></form>。我也假设你加载了jQuery，所以：

<script type="text/javascript">
    $('#searchForm').submit( function(e) {
        e.preventDefault();
        var searchString = $(this).find('input:first').val(); //  get the address
        Geocoder.geocode( { 'address': searchString}, function(results, status) {
              if (status == google.maps.GeocoderStatus.OK) {
                Map.setCenter(results[0].geometry.location);
              } else {
                alert("Geocode error: " + status + "\n" + "Try another address");
              }
            });
    });
</script>

在这里演示：http://jsfiddle.net/toxik/Xjy3S/embedded/result/

Answer 9

Codeigniter会话将是最容易使用的。

提交地址后，请设置一些用户数据。

  
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Mycontroller extends CI_Controller {
    function __construct()
    {
        parent::__construct();
    }

    function index()
    {       
        if($_SERVER['REQUEST_METHOD'] == "POST")
        {
            //do something from post
            $this->session->set_userdata('street', $this->input->post('street'));  
            $this->session->set_userdata('city', $this->input->post('city'));  
            $this->session->set_userdata('state', $this->input->post('state'));  
            $this->session->set_userdata('zip', $this->input->post('zip')); 

            //then redirect to the next page
            redirect('mycontroller/map');   
        }
        else
        {
            //load the form
            $this->load->view('address_form');
        }
    }

    function map()
    {   
        $data = array(
            "street" => $this->session->userdata('street'),
            "city" => $this->session->userdata('city'),
            "state" => $this->session->userdata('state'),
            "zip" => $this->session->userdata('zip')
        );
        $this->load->view('map' $data);
    }

}

在隐藏输入中设置值。只需让javascript抓住输入ID的值......

Answer 10

检查这个

// JavaScript function function abc(pram1, pram2) {    alert(pram1 + pram2); } // end of JS function

现在在您的搜索表单上调用此函数。传递您要移动其他页面的所有参数像

<a name="search" href="javascript:void(0)" onclick="abc('param1','param2')> search </a>

如何将数据从输入表单传递到另一页面上的js

10 个答案: