变量显示在一个函数中，但没有另一个 Jquery

Question

我将 PHP 会话传递给要在 Jquery 代码中使用的变量。下面，我在四个区域调用控制台日志。控制台日志编号 1 和 3 反映的变量值没有问题。 2和4没有。我需要 #4 具有价值，以便我可以在条件中使用变量。我想这可能是范围问题，但我不明白为什么。寻求一些指导。

<script type="text/javascript">

  // GET VARIABLES THROUGH PHP SESSSION
  customerType = '<?php echo $customerType; ?>';
  myClicks = '<?php echo $myClicks; ?>';
  email = '<?php echo $email; ?>';

  console.log('1 ' + email);
  console.log('1 ' + myClicks);
  console.log('1 ' + customerType);

  //SET NUMBER OF ROWS TO DISPLAY AT A TIME

  $(document).ready(function () {

    rowsPerPage = 5;

    // GETTING DATA FROM FUNCTION BELOW
    getData();

    $('#load-more').click(function () {

      console.log('2 ' + email);
      console.log('2 ' + myClicks);
      console.log('2 ' + customerType);

      $('#load-more').html('Loading...');
      var rowID = Number($('#row-id').val());
      var allCount = Number($('#count').val());
      rowID += rowsPerPage;
      if (rowID <= allCount) {
        $('#row-id').val(rowID);
        getData();
      } else {
        $('#load-more').html('End Of Data');
        //$('#load-more').html('');
      }
    });

    /* REQUEST DATA */
    function getData () {

      console.log('3 ' + email);
      console.log('3 ' + myClicks);
      console.log('3 ' + customerType);

      var rowID = $('#row-id').val();
      var allCount = $('#count').val();
      $.ajax({
        url: 'promotions/newest-load-button-data.php',
        type: 'post',
        data: {
          rowID: rowID,
          rowsPerPage: rowsPerPage
        },
        dataType: 'json',
        success: function (response) {
          setTimeout(function () {
            loadData(response);
            $('#load-more').html('Load More');
          }, 1000);
        }
      });
    }

    /* LOAD DATA TO PAGE */

    function loadData (data) {

      console.log('4 ' + email);
      console.log('4 ' + myClicks);
      console.log('4 ' + customerType);

      var dataCount = data.length;

      for (var i = 0; i < dataCount; i++) {
        if (i == 0) {
          var allCount = data[i]['allcount'];
          $('#count').val(allCount);
        } else {
          var promoID = data[i]['promoid'];
          var promoName = data[i]['promoname'];
          var promoRefNum = data[i]['promorefnum'];
          var promoType = data[i]['promotype'];
          var theBanner = data[i]['thebanner'];

// Here I will use conditions based on email, customerType, and myClicks

          if (promoType == 'Banner') {
            $('#load-container').append('<div class="row-center-center padding-top-5 padding-bottom-2"><div>' + promoName + '</div></div>');
            $('#load-container').append('<div><div class="wrap-content"><img class="mobile-banner-scale" id="visitor-banner-click" src=' + theBanner + '></div></div>');
          }

          if (promoType == 'Video Banner') {
            $('#load-container').append('<div class="row-center-center padding-top-5 padding-bottom-2"><div>' + promoName + '</div></div>');
            $('#load-container').append('<div><video class="mobile-video-size" id="visitor-banner-click" src=' + theBanner + ' autoplay muted loop></video></div>');
          }
        }

        $('#load-more').html('Load More');
      }
    }
  });
</script>

Answer 1

从 jQuery 3.0 开始，添加就绪处理程序的推荐方法是 第一种方法，$(fn)。如事件部分所述， $(document).on("ready", fn) 事件形式略有不同 语义并在 jQuery 3.0 中被删除。

此代码 sn-p 使用推荐的文档就绪处理程序工作。

    
        jQuery(function(){  //document.ready

            console.log('2 ' + email);
            console.log('2 ' + myClicks);
            console.log('2 ' + customerType);
            loadData('something');
        });

        customerType = 'test1';
        myClicks = 'test2';
        email = 'test3';

        function loadData (data) {
    
            console.log('4 ' + email);
            console.log('4 ' + myClicks);
            console.log('4 ' + customerType);
       }

    

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 2

这绝对是范围问题。我发现如果我在全局中调用该函数，我可以获得我需要的响应。但是出现了数据长度错误。我决定在 php 数据页面上调用会话的值，并将其包含在 JSON 数组中，以通过 ajax 以及加载中所需的其他变量。所以它现在可以工作了，不同的方式。我很欣赏大家的看法。

Answer 3

// GET VARIABLES THROUGH PHP SESSSION
customerType = "where are customers";
myClicks = "element clicked";
email = "email sent";

console.log('1 ' + email);
console.log('1 ' + myClicks);
console.log('1 ' + customerType);

//SET NUMBER OF ROWS TO DISPLAY AT A TIME

$(document).ready(function() {

    rowsPerPage = 5;

    // GETTING DATA FROM FUNCTION BELOW
    getData();

    $("#load-more").click(function() {

        console.log('2 ' + email);
        console.log('2 ' + myClicks);
        console.log('2 ' + customerType);

        $('#load-more').html('Loading...');
        var rowID = Number($("#row-id").val());
        var allCount = Number($("#count").val());
        rowID += rowsPerPage;
        if (rowID <= allCount) {
            $("#row-id").val(rowID);
            getData();
        } else {
            $('#load-more').html('End Of Data');
            //$('#load-more').html('');
        }
    });

    /* REQUEST DATA */
    function getData() {
        console.log('3 ' + email);
        console.log('3 ' + myClicks);
        console.log('3 ' + customerType);

        loadData();
    }

    /* LOAD DATA TO PAGE */

    function loadData(data) {
        console.log('4 ' + email);
        console.log('4 ' + myClicks);
        console.log('4 ' + customerType);
    }
});

一切似乎都很好，您的变量 email,myClicks,customerType 正在控制台中打印值，您需要再次检查，我认为问题是其他问题，请再次检查。