0

我在 java 脚本中有一个函数，我用它从我的 asp.net mvc 控制器中获取 JSON，以在我的视图中显示该项目：

<script type="text/javascript" language="javascript">
var k = 0;
var record_count = 0;
var col_count = 3;
var row_count = record_count / col_count;
var str = "<table>";

function itemTemplate() {
 var url = '<%: Url.Content("~/") %>' + "ProductListing/AllProductListing/0";
 $.getJSON(url, function (product) {
      $.each(product.ja, function (index, value) {
       //append rows and column to my table by concat the string of 'str'
      });
 });
  str += '</table>';
  alert(str);
  return (str);
}
$(document).ready(function () {
  alert(itemTemplate());
});
</script>

问题：当我在函数中警告函数时$(document).ready，首先它是警告<table></table>的，然后继续警告我在$.getJSON函数中连接它的完整字符串。所以该函数在获取 JSON 之前返回。

有人对此有任何想法吗？谢谢。

4

4 回答 4

1

尝试设置async为 false，然后$.getJSON拨打电话

代码：

jQuery.ajax({async : false});
$.getJSON( ... );

参考：http ://api.jquery.com/jQuery.ajax/

注意：从 jQuery 1.8 开始，不推荐使用 async: false 。

替代解决方案

<script type="text/javascript" language="javascript">
var k = 0;
var record_count = 0;
var col_count = 3;
var row_count = record_count / col_count;
//var str = "<table>";

function itemTemplate(callback) {
 var url = '<%: Url.Content("~/") %>' + "ProductListing/AllProductListing/0";
 $.getJSON(url, callback);
  //str += '</table>';
  //alert(str);
  //return (str);
}
$(document).ready(function () {
  itemTemplate(function (product) {
      var str = "<table>";
      $.each(product.ja, function (index, value) {
       //append rows and column to my table by concat the string of 'str'
      });
      str += "</table>";
      alert(str);
  });
});
</script>
于 2012-06-28T03:08:44.213 回答
1

好吧，这就是 ajax 的工作方式，它$.getJSON启动了对服务器的异步调用，因此您将在 ajax 调用完成之前点击下一行。您应该在回调中为getJSON

function itemTemplate() {
 var url = '<%: Url.Content("~/") %>' + "ProductListing/AllProductListing/0";
 $.getJSON(url, function (product) {
      var html = "<table>";
      $.each(product.ja, function (index, value) {
       //append rows and column to my table by concat the string of 'str'
      });
      html += "</table>";
      // now append html to the DOM
 });
}

该函数将在您从服务器取回数据之前返回，因此您想要对从服务器返回的数据执行的任何操作都必须在.getJSON

于 2012-06-28T03:08:48.267 回答
1

对服务器的 Ajax 请求是异步的。这意味着，客户端计算机说：在第 3 方服务器上进行操作。当你有一个答案（也就是一个回应）然后告诉我，我会处理它。

所以..让连接那个JQuery代码来做-正是-...

<script type="text/javascript">

    $(document).ready(function () {
        // Just call this method, on load. 
        // (yuck, but i'm following your code)...
        itemTemplate(); 
    });

    function itemTemplate() {
        $.ajax({
            url: "/ProductListing/AllProductListing/0",
            type: "GET",
            success: function (data, textStatus, jqXHR) {
                // Handle success. like .. append data, etc.
                //.....
                alert("whatever");
            },
            error: function (jqXHR, textStatus, errorThrown) {
                // Handle the error. Don't forget you can access
                // data from the response (aka. the jqXHR)...
                alert(errorThrown);
            }
        });
    }

</script>

这里的诀窍是连接success:和error:回调的。

一旦进入那里，你可以做任何你想做的事情，等等。

尝试在其中放置一个断点并查看值:)

参考：jQuery.ajax() 文档的.

于 2012-06-28T04:05:04.297 回答
0

$.getJSON异步执行，这意味着一旦它触发请求，函数调用就被认为是完整的，JavaScript 引擎将继续执行下一行代码：str += '</table>'.

您会收到两个警报，因为您在alert函数中调用了该函数，该函数itemTemplate本身被调用以返回在 中进行的alert函数调用的值$(document).ready。你的意思是打alert两次电话吗？

无论如何，就构建而言，您的意图似乎是str在完成后关闭表格标签$.each...

var k = 0,
    record_count = 0,
    col_count = 3,
    row_count = record_count / col_count,
    str = '<table>';

function itemTemplate() {
    var url = '<%: Url.Content("~/") %>' + "ProductListing/AllProductListing/0";
    $.getJSON(url, function (product) {
        $.each(product.ja, function (index, value) {
            //append rows and column to my table by concat the string of 'str'
        });
        str += '</table>';
        alert(str);
    });
}

$(document).ready(function () {
    itemTemplate();
});
于 2012-06-28T03:56:06.887 回答