-1 
<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側では、少なくともデータを表示できます。ありがとうございます。非常に基本的な質問ですが、私はすぐにこれから抜け出す方法を見つける必要があるので、私を案内してください...

4

2 に答える 2

2

beforeSendの代わりに使用してくださいbeforSend。そして、あなたはあなたのdivを非表示/表示するためにそしてを使うべきです、それはより明確ですhide()。show()

編集 ：

私はあなたがどんなデータを期待しているのかわかりません、そしてそれで私はあなたを本当に助けることができません、しかしそれをこのようにデバッグしてみてください：

  • Chromeを使用している場合は、ページの任意の場所を右クリックして、[この要素を検査する]（またはそのようなsmthg）をクリックします。
  • Firefoxを使用している場合は、Firebug拡張機能をダウンロードしてください
  • IEを使用している場合は、以前のブラウザの1つをダウンロードしてください

あなたはインターネット上でこのツールを使って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')、複数の要素を返します

于 2012-10-18T15:22:29.057 に答える
0

（、）を（+）に置き換えるだけで、動作を開始しました..奇妙な!!!

于 2012-10-18T15:23:56.140 に答える