Question

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" language="javascript">

// when the document has finished loading, get the data
$(document).ready(GetData());

function GetData() {

    $.ajax({
        beforSend: function () {
            $('#loadingDiv').css('display', 'block')
        },
        complete: function () {
            $('#loadingDiv').css('display', 'none')
        },
        type: "GET",
        url: "/Integrationsonify/Data.aspx",
        data: dataObject,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {

            var header = $("#accordion");

            $.each(data, function () {

                header.append("<a href='javascript:toggleDiv();'>" + this.Name + " </a>", "<div id='myContent' style='display:none'>" + "<ul>", "<li>" + this.Id + "</li>", "<li>" + this.SName + "</li>", "</ul>" + "</div");

            });
        },
        error: function () {
            alert("There was an error while rendering the page. Please contact the Admin for details");
        }

    });

   }
   function toggleDiv() {

                  $("#myContent").toggle();

   }

</script>
<div id="loadingDiv" style="display: block;">
    hi
</div>
<div id="accordion">

</div>

我无法切换myContent div ..是不是因为它在ajax调用中创建？ div显示但是如果我为页面做了一个视图源我在手风琴div中看不到任何数据..但是在浏览器的ui端我至少可以看到数据。谢谢我很抱歉，我知道它的一个非常基本的问题，但我现在需要尽快找到解决方法，所以请指导我......

Answer 1

使用beforeSend代替beforSend。你应该使用hide()和show()隐藏/展示你的div，它更清晰。

编辑：

我不知道您期待什么数据，因此我无法真正帮助您，但请尝试以这种方式进行调试：

如果您使用的是chrome，请右键单击页面上的任意位置，然后单击“检查此元素”（或类似于此）
如果您使用的是Firefox，请下载firebug扩展名
如果您在IE中，请下载以前的浏览器之一

你会在互联网上找到一些用这些工具调试js的方法，如果你做了很多js，它会非常有用。

只是一个建议，尝试在使用jQuery时以这种方式插入HTML，它更具可读性，你可以调试它：

header.append(
    $('<a/>').click(function() {
        toggleDiv();
        return false;
    }),
    $('<div id="myContent"/>').hide().append(
        $('<ul/>').append(
            $('<li/>').text(this.Id),
            $('<li/>').text(this.SName)
        )
    )
);

编辑2：

对不起，我没想到它，应该是：

$('<a/>').click(function() {
    toggleDiv($(this));
    return false;
})

在你的toggleDiv函数中：

function toggleDiv ($elem) {
    $elem.next().toggle();
}

我认为这会起作用

编辑3：

当然你应该放$('<div class="myContent"/>')，因为HTML规范禁止具有相同id的多个元素。然后，您的选择器变为$('.myContent')并返回多个元素

Answer 2

我只是用（+）替换（，）并开始工作..weird !!!

使用jquery切换div

2 个答案: