javascript - JSON 返回 url 两次

Question

我的页面上有一个 html 表，其中的原始数据具有“url”，我试图从随机行一次获取一个 url，但是我的代码返回的 url 为 http://www.test.com/products/product-namehttp://www.test.com/products/product-name.json ，正如你所看到的，它返回 url 两次，一次没有 json，另一次则带有 json 数据，因此我得到了 404。

我只需要 .json URL，而不是第一部分。

如何去掉第一个不是 json 的 url？

这是代码。

$(document).ready(function() {
  $(document).on('click', '#closepopup', function() {
    $("#popup").removeClass('popupslidein')
  });
  var tablelink = "https://test.com/pages/product-listing-for-popups.json"; //products url for json data
  $.getJSON(tablelink, function(data) {
    var table = data.page.body_html;
    $('#popuptable').append(table);
    startthepopups()
  });
  var suburbink = "https://test.com/pages/product-listing-suburbs-for-popups"; //suburb names in table rows
  $.getJSON(suburbink, function(data) {
    var suburb = data.page.body_html;
    $('#popupsuburb').append(suburb)
  });
  var namelink = "https://test.com/pages/product-listing-names-for-popups"; //names in table rows
  $.getJSON(namelink, function(data) {
    var name = data.page.body_html;
    $('#popupname').append(name)
  });

  function startthepopups() {
    var popupstay = 10000;
    var popuptrigger = 100000;

    function triggerpopup() {
      var getrandomtd = Math.floor((Math.random() * $('#popuptable tr').length) + 1);
      var link = $('#popuptable tr:nth-child(' + getrandomtd + ')').text();
      console.log(link);
      var productname = '';
      var getrandomsuburbtd = Math.floor((Math.random() * $('#popupsuburb tr').length) + 1);
      var suburblink = $('#popupsuburb tr:nth-child(' + getrandomsuburbtd + ')').text();
      var getrandomnametd = Math.floor((Math.random() * $('#popupname tr').length) + 1);
      var randomname = $('#popupname tr:nth-child(' + getrandomnametd + ')').text();
      $.getJSON(link + '.json', function(data) {
        productname = data.product.title;
        imagelink = data.product.images[0].src;
        if (!$("#popup").hasClass("popupslidein")) {
          $('#popupsomeone span.name').empty().append(randomname);
          $('#popupsomeone span.location').empty().append(suburblink);
          $('#popupimage').css('background-image', 'url(' + imagelink.split('.jpg')[0] + '_small.jpg)');
          $('#popupproduct a').attr('href', link).empty().append(productname);
          $("#popupagotext").empty().append(Math.round(Math.random() * 15 + 10));
          $("#popup").addClass('popupslidein');
          setTimeout(function() {
            $("#popup").removeClass('popupslidein')
          }, popupstay);
        }
      });
    }(function loop() {
      var random = Math.round(Math.random() * 10) * 100000 + popuptrigger;
      setTimeout(function() {
        triggerpopup();
        loop()
      }, 60000)
    }());
  }

});

Answer 1

$.getJSON() 如果它认为是相对的，则倾向于将当前 url 附加到您传递给它的路径。要实现此功能，您可以尝试像这样使用 $.getJSON() 。请记住，所使用的协议(protocol)将是该代码所在的当前页面。

$.getJSON('//test.com/pages/product-listing-for-popups.json')

我还注意到，您的代码中没有任何地方有 http://www.test.com/products/product-name.json 的网址，您确定要共享正确的代码片段？

工作演示

以下两种使用 $.getJSON() 和完全限定 url 的方法工作得很好:

$(document).ready(function() {
  var url = "https://jsonplaceholder.typicode.com/todos/1";
  
  // Example 1
  $.getJSON(url)
    .done(function( data ) {
      console.log(data);
    });
    
  // Example 2
  $.getJSON(url, function(data) {
    console.log(data)
  });
  
});

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