1

動的に生成された折りたたみ可能な jQuery Mobile ページがあります。ページを離れてから戻る場合を除いて、うまく機能します。その場合、折り畳み式が 2 回表示されます。リフレッシュすると問題は解決しますが、それは明らかに良い解決策ではありません。ここの他の人は同様の症状を説明していますが、それらの解決策は私にはうまくいきませんでした. 誰かが私を助けてくれることを願っています。pageinit を誤用している可能性があると思います...

jQuery Mobile 1.3.1 で jQuery 1.9.1 を使用しています。私は Codiqa を使用してページを生成しているため、jQuery 1.3.1 を使用しています。すべてのページが個別の html ファイルになるようにコードを生成しました。

これが私のコードです：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Characters | PCT</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">

  <link href="css/codiqa.ext.css" rel="stylesheet">
  <link href="css/jquery.mobile-1.3.1.css" rel="stylesheet">

  <script src="js/jquery-1.9.1.js"></script>
  <script src="js/jquery.mobile-1.3.1.js"></script>
  <script src="js/codiqa.ext.js"></script>
  <script src="http://www.parsecdn.com/js/parse-1.2.15.min.js"></script>
  <script src="js/pct.js"></script>

</head>
<body>
   <div data-role="page" data-control-title="Characters" id="characters" 
      class="character_page">
   <script>
  $(document).on("pageinit", "#characters", function() {
    var charQuery = new Parse.Query("Character");
            charQuery.equalTo("user", Parse.User.current());
            charQuery.find({
           success: function(results) {
                  for (var j = 0; j < results.length; j++) {
                var object = results[j];
        var charName = object.get('charName');
        var charNumActions = object.get('charNumActions');
        var charSpd = object.get('charSpd');

                    $("#char_list").append("<div data-role='collapsible'><h4> " + 
                    charName + "</h4><p><strong>Number of Actions:</strong> " + 
                    charNumActions + "</p><p><strong>Spd:</strong> " + charSpd + "</p>
                    <a data-role='button' class='edit_button' 
                    href='edit_character.html?charname=" + charName + "' data-icon='edit' 
                    data-iconpos='left'>Edit</a><a data-role='button' 
                    id='delete_char_button' class='delete_button' data-inline='true' 
                    data-icon='delete' data-iconpos='left'>Delete</a></div>");

                    $("#char_list").collapsibleset("refresh");
                $(".edit_button").buttonMarkup();
        $(".delete_button").buttonMarkup();
         }
             }
         }); 
    });
</script> 
  <div data-theme="a" data-role="header">

ご覧いただきありがとうございます。

4

1 に答える 1