jquery - 将变量从 JavaScript 页面传递到 PHP 页面

Question

我有 JavaScript 代码，是从有关阅读更多主题的在线教程中复制的，我一直在使用它，但不了解某些代码的作用。现在我想将该脚本中的变量 ID 传递给另一个名为 main.php 的 PHP 页面。我该怎么做？

JavaScript：

(function($) {
  var id = "<?php echo variable; ?>"; //this line is where i want to set the variable and pass it to the main.php
  $.fn.loaddata = function(options) {
    // Settings
    var settings = $.extend(
      {
        loading_gif_url: "ajax-loader.gif", //url to loading gif
        end_record_text: "End of Feed", //no more records to load
        data_url: "main.php", //url to PHP page
        start_page: 1, //initial page
      },
      options,
    );

    var el = this;
    loading = false;
    end_record = false;
    contents(el, settings); //initial data load

    $(window).scroll(function() {
      //detact scroll
      if ($(window).scrollTop() + $(window).height() >= $("#cont2").height()) {
        //scrolled to bottom of the page
        contents(el, settings); //load content chunk
      }
    });
  };
  //Ajax load function
  function contents(el, settings) {
    var load_img = $("<img/>")
      .attr("src", settings.loading_gif_url)
      .addClass("loading-image"); //create load image
    var record_end_txt = $("<div/>")
      .text(settings.end_record_text)
      .addClass("end-record-info"); //end record text
    if (loading == false && end_record == false) {
      loading = true; //set loading flag on
      el.append(load_img); //append loading image
      $.post(settings.data_url, { page: settings.start_page }, function(data) {
        //jQuery Ajax post
        if (data.trim().length == 0) {
          //no more records
          el.append(record_end_txt); //show end record text
          load_img.remove(); //remove loading img
          end_record = true; //set end record flag on
          return; //exit
        }
        loading = false; //set loading flag off
        load_img.remove(); //remove loading img
        el.append(data); //append content
        settings.start_page++; //page increment
      });
    }
  }
})(jQuery);

$("#results").loaddata();

标签： jquery

Answer 1

使用下面的代码，您可以在 main.php 文件中将 id 读取为 $_POST['id'] 。我已将“data_id”添加到“settings”var，然后在 $.post 中，我传递了一个附加参数，如“id: settings.data_id” 请检查以下代码：

 (function($) {
    var id = "<?php echo $variable; ?>"; 
      $.fn.loaddata = function(options) {// Settings
    var settings = $.extend(
      {
        loading_gif_url: "ajax-loader.gif", //url to loading gif
        end_record_text: "End of Feed", //no more records to load
        data_url: "main.php", //url to PHP page
        start_page: 1, //initial page
        data_id: id
      },
      options,
    );

    var el = this;
    loading = false;
    end_record = false;
    contents(el, settings); //initial data load

    $(window).scroll(function() {
      //detact scroll
      if ($(window).scrollTop() + $(window).height() >= $("#cont2").height()) {
        //scrolled to bottom of the page
        contents(el, settings); //load content chunk
      }
    });
  };
  //Ajax load function
  function contents(el, settings) {
    var load_img = $("<img/>")
      .attr("src", settings.loading_gif_url)
      .addClass("loading-image"); //create load image
    var record_end_txt = $("<div/>")
      .text(settings.end_record_text)
      .addClass("end-record-info"); //end record text
    if (loading == false && end_record == false) {
      loading = true; //set loading flag on
      el.append(load_img); //append loading image
      $.post(settings.data_url, { page: settings.start_page,id: settings.data_id}, function(data) {
        //jQuery Ajax post
        if (data.trim().length == 0) {
          //no more records
          el.append(record_end_txt); //show end record text
          load_img.remove(); //remove loading img
          end_record = true; //set end record flag on
          return; //exit
        }
        loading = false; //set loading flag off
        load_img.remove(); //remove loading img
        el.append(data); //append content
        settings.start_page++; //page increment
      });
    }
  }
})(jQuery);

$("#results").loaddata();