Question

我有以下html：

<div class="actor_container span-3 column" data-url="http://www.spotlight.com/5094-1276-6177" data-age-min="31" data-age-max="40" data-height="180" data-weight="72" data-gender="male" data-eye="green">
....
</div>

当用户点击图像时是否可以POST每个数据属性，然后在另一个文件中我可以使用$ _GET来检索它们？

例如，像这样：

$('.actor_container').on("click", function (e) {
            e.preventDefault();
            $.ajax({
                type: 'POST',
                data: $(this).data("url"),
                ...rest of code goes here...
            });
        }); //on

然后在我的PHP文件中，使用类似：

的内容

echo htmlspecialchars($_GET['url']);

更新从下面的答案，这是我的JS代码（我已经发布了完整的点击功能，所以你可以看到）：

$('.actor_container').on("click", function (e) {
            $('.loading_overlay').show();
            $('#actor_data').hide();
            $('#actor_data_container').css('top','0'); 
            e.preventDefault();
            $.ajax({
                url: "http://79.170.44.105/samskirrow.com/nial/wp-content/plugins/nial-customizations/front-end/actor-profile.php?url=" + $(this).data("url"),
                type: 'GET',
                success: function(res) {
                    var data = $.parseHTML(res); 
                    // append all data
                    $('#actor_data').html(data);
                    $('#actor_data').show();
                    $('.loading_overlay').hide();
                }
            });


           $.ajax({
                type: 'POST',
                data: ({ 
                    "age-min" : $(this).data("age-min"), 
                    "age-max" : $(this).data("age-max") 
                }),
            });

});

然后在我的PHP文件中我有：

var_dump($_POST);

返回

array(0) { }

Answer 1

有一种方法可以序列化您的数据：

$('.actor_container').on("click", function (e) {
    e.preventDefault();
    var length_data = Object.keys($(this).data()).length;
    var data = [];
    for (i = 0; i < length_data; i++) {
      var str = Object.keys($(this).data())[i]
      data.push({ name : str, value : $(this).attr('data-'+str) })
    }
    $.post("your_page.php", data);
})

在您的php网站上，您可以访问以下数据：

    $_POST['url']
    $_POST['age-min']
    $_POST['weight']
    ...

尝试序列化，这里是JSFiddle

<强>更新

混合你的2 ajax电话：

$('.actor_container').on("click", function (e) {
    e.preventDefault();
    $('.loading_overlay').show();
    $('#actor_data').hide();
    $('#actor_data_container').css('top','0'); 
    var length_data = Object.keys($(this).data()).length;
    var data = [];
    for (i = 0; i < length_data; i++) {
      var str = Object.keys($(this).data())[i]
      data.push({ name : str, value : $(this).attr('data-'+str) })
    }
    $.ajax({
      url: "http://79.170.44.105/samskirrow.com/nial/wp-content/plugins/nial-customizations/front-end/actor-profile.php",
      data : data,
      type: 'GET',
      success: function(res) {
        var data = $.parseHTML(res); 
        // append all data
        $('#actor_data').html(data);
        $('#actor_data').show();
        $('.loading_overlay').hide();

    });

Answer 2

当用户点击图像时是否可以POST每个数据属性，然后在另一个文件中我可以使用$ _GET来检索它们？

没有。

如果您在一个请求中发布它们，则数据会显示在该请求中（如果您使用表单编码，则会在$_POST中）。

如果您希望$_GET在稍后发出请求时将数据包含在其中，那么您需要将数据放入该请求的查询字符串中（并且它可能会使用Ajax冗余对其进行POST）。

您可以使用Ajax发布它们，然后将它们存储在某个地方（例如在会话中），然后从存储它们的任何地方读回它们，而不是在后面的请求中使用$_GET。

Answer 3

我会建议你如何使用$ _POST方法和jquery。

您的示例

$('.actor_container').on("click", function (e) {
            e.preventDefault();
            $.ajax({
                type: 'POST',
                data: ({ "url" : $(this).data("url"), "second_key" : variable_or_value }),
                ...rest of code goes here...
            });
        });

在数据的上述示例中，我给出key url并给出了值。您可以PHP访问$_POST['url']的值。第二个可以通过$_POST['second_key']

访问

使用ajax点击POST数据属性

3 个答案: