jQuery,MVC,jSon - 构建div的表,由回调填充

时间:2010-06-21 20:23:21

标签: jquery json html

我正在尝试构建一个包含动态构建信息的表。

我的想法是将DivA放在每个单元格中,然后将DivB和DivC放在DivA标签内(DivB显示'加载'img,DivC显示内容)。然后我想使用json调用我的ASP.Net MVC Web应用程序来更新单元格。到目前为止听起来很疯狂吗?!

<div class="divA">
    <h2>
        Stuff</h2>
    <div class="divB">
        <img src="Images/ajax-loader.gif" />
        <span>Loading</span>
    </div>
    <div class="divC">
    </div>
</div>

使用此代码,我想我可以激活我的方法并处理回叫?

$(document).ready( 
    function() 
    {
        $("div.divA").each(
            function(i)
            {
               updateCellDivs($(this));
            }
         );
    }
 )

但是......我试图在下面的'loading'上调用show时遇到异常 - 调用fadeIn同样的事情。 'loading'对象的类型为disphtmldivelement - 但DivA也是如此。

我不知所措 - 我做错了什么?!

感谢您提出任何意见,

丹麦安德斯。

updateCellDivs = function(DivA)
    { 
        jQuery.getJSON("/Home/GetSomething",
        function(json)
        {
            mainDiv  = DivA[0];

            divs = $("div", mainDiv);

            loading  = divs[0];
            contents = divs[1];

            // Abort if there is no data to update.
            if (contents.length==0)
            {
                return;
            }

            loading.show(1000);
            //contents.fadeOut(1000);

            // If no response was given, the data was not yet available.
            // Ask again in two seconds!
            if (json == "")
            {
                setTimeout(updateCellDivs, 2*1000);
                return;
            }                

            DivA.fadeOut(1000);
            //loading.fadeOut(1000);


            DivA.fadeIn(1000);

        });         
    }

1 个答案:

答案 0 :(得分:1)

问题在于这两行

loading  = divs[0];
contents = divs[1];

jQuery的索引器返回实际的html元素。所以你不能直接对它们执行任何jQuery函数,比如show / hide。你必须将它们包装在jQuery对象中,如下所示:

loading  = $(divs[0]);
contents = $(divs[1]);

see the live working demo here.