0

このjqueryアコーディオンコードを取得しました：

 $(function () {
    var icons = {
        header: "ui-icon-circle-arrow-e",
        activeHeader: "ui-icon-circle-arrow-s"
    };
    $("#accordion")
      .accordion({
          header: "> div > h3",
          collapsible: true,
          active: false,
          heightStyle: "content",
          icons: icons
      })
      .sortable({
          axis: "y",
          handle: "h3",
          stop: function (event, ui) {
              var items = [];
              ui.item.siblings().andSelf().each(function () {
                  //compare data('index') and the real index
                  if ($(this).data('index') != $(this).index()) {
                      items.push(this.id);
                  }
              });
              // IE doesn't register the blur when sorting
              // so trigger focusout handlers to remove .ui-state-focus
              ui.item.children("h3").triggerHandler("focusout");
              ui.item.parent().trigger('stop');
          }
      })
    .on('stop', function () {
        $(this).siblings().andSelf().each(function (i) {
            //kjører for alle "childs" i accordian...
            $(this).data('index', i);
        });
    })
    .trigger('stop');
});

これは、次のような静的 HTML で問題なく機能します。

<div id="accordion">
    <div id ="Scene 1" class="group">
        <h3><b>#1: Task no 1</b></h3>
        <div>
             <textarea > Description of first task </textarea>
        </div>
    <div id ="Scene 2" class="group">
        <h3><b>#2: Task no 2/b></h3>
        <div>
            <textarea> Decription of task</textarea>
        </div>
    </div>
</div>

しかし、ノックアウトで HTML を動的にすると、タイトルをクリックしてもアコーディオンが展開 (または折りたたまれ) しなくなりました。

ノックアウト/動的HTMLは次のとおりです。

<div id="accordion" data-bind="foreach: Tasks">
    <div data-bind="attr : {'id': 'Task' + TaskId}" class="group">
        <h3><b>#<span data-bind="text: TaskId"></span>: <span data-bind="text: Taskname"></span></b></h3>
        <div>
             <textarea data-bind="value: Description"></textarea>  
        </div>
    </div>
</div>

誰が問題がどこにあるかを見ることができますか?

4

2 に答える 2

1

ブラウザの開発コンソールにエラーが表示されますか? したがって、Chrome では F12 を押す必要があります (私はそう思います)。または、私のように Firefox を使用している場合は、FireBug をインストールしてから Web ページで F12 を押します。

これらのツールは、Javascript エラーのデバッグに役立ちます。あなたの構文に大きな間違いはありません。

于 2013-09-09T09:51:19.917 に答える