Javascript 单击指向不同页面的链接时存储元素的值

Javascript 单击指向不同页面的链接时存储元素的值,javascript,php,jquery,html,Javascript,Php,Jquery,Html,我一直在努力想,当有人点击链接时,如何将元素(image)的值存储到不同的页面(anywhere.php) HTML: 您可以使用查询字符串通过链接将信息传递到PHP页面。例如: <div class="slide-body" data-group="slide"> <img src="assets/img/slide-1.jpg" name="Image 1"> <div class="caption add-box" data-animate="s

我一直在努力想,当有人点击链接时,如何将元素(image)的值存储到不同的页面(anywhere.php)

HTML:


您可以使用查询字符串通过链接将信息传递到PHP页面。例如:

<div class="slide-body" data-group="slide">

  <img src="assets/img/slide-1.jpg" name="Image 1">

  <div class="caption add-box" data-animate="slideAppearRightToLeft">
    <a href="file-2.php?imageName=myImageName" class="butn btn btn-default">Add</a>
  </div>
</div>

然后在PHP中,您可以访问
$\u GET['imageName']
,它将返回
'myImageName'

数据未保存在“页面”中。 它可以保存在会话、本地存储、cookies。。。通常还有数据库

因此,第一个问题是:哪里应该是存储数据的最佳位置

这严格取决于应用程序每个范围的行为

例如,在这种情况下,数据是易变的还是应该从许多不同的设备多次检索?您希望跟踪用户的数据,还是数据只驻留在用户设备中

无论如何,您接收的文件将充当一个控制器并处理它。此文件也可以是显示数据的相同文件,根据请求执行一项或另一项任务

您的php文件将通过请求接收数据,该请求可以是GET或POST类型。通常,GET方法用于检索数据,POST方法用于向其发送数据

因此,通过一种非常简单的方式(可能会考虑到安全问题和各种清理/验证),您的php将具有:

<?php if(isset($_POST['image'])){
$image_path = $_POST['image'];
// an image has been sent so then based on you logic will be stored somewhere
echo 'ok';
die();
}elseif(isset($get['whatever'])){
// a GET request have been done with whatever parameter (if you have to show only current user selection of images you'll need any kind of descriptor for him, for example an id that came with your image before?)
} ?>

服务器端代码在哪里?谢谢您的解决方案。但是,是否有任何可能的方法将“myImageName”替换为图像的实际名称?例如,这里图像的“名称”是“图像1”。我下一张图片的名字可能是“图片2”等等。所以,我怎样才能为different image获得不同的名称,并像以前一样存储它们。也许使用PHP代码片段调用图像的“name”属性就可以了?谢谢你的解决方案。图像的“名称”属性数据将存储在会话中。例如,当用户单击“添加”链接时,图像的名称将存储在会话中(可能在同一页面上),然后用户单击另一个链接,再次保存下一个图像的名称。因此,以这种方式,多个名称(数据)将存储在一个会话中。之后,我希望能够从不同的页面调用存储的“名称”。
<div class="slide-body" data-group="slide">
  <img src="assets/img/slide-1.jpg" name="Image 1">
  <div class="caption add-box" data-animate="slideAppearRightToLeft">
    <a href="#" class="butn btn btn-default" data-image="assets/img/slide-1.jpg">Add</a>
  </div>
</div>
<script>
  // jquery need to be loaded before this point
  $('.butn').click(function(e){
    e.preventDefault();
    var imagepath = $(this).data('image');
    $.ajax({
      url: '/path/to/your/file_that_receive_data.php',
      type: 'post',
      data: {'image':imagepath},
      success: function(data){
        if(data.length && data === 'ok'){
          alert('Image saved!');
        }else{
          alert('some sort of soft managed error or alert');
        }
      },
      error: function(){
        alert('some technical error occurred');
      }
    });
  });
</script>