Question

我一直遇到js函数的问题，我写了这个函数来处理json文件并使用jquery-mobile在Phonegap的四列网格菜单中打印出来。这是在Jsfiddle工作的Demo工作。但是，当我在phonegap中运行确切的程序时，它将无法在通过ios模拟器运行时在屏幕上打印。这是完整显示的html页面：

<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-type" value="text/html; charset=UTF-8" />
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.4.0.css" />  
<script type="text/javascript" src="phonegap.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.4.0.js"></script>
<script type="text/javascript">
var json = {
 "tcontent": [{
  "Chapter": "1",
  "Name": "General Principles of Antibiotic Perscribing",
  "url":"<a href='general_principles.html'>",
  "Background":"yellow"
}, {
  "Chapter": "2",
  "Name": "Note on meticillin resistant SA",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "3",
  "Name": "Empirical Therapy Guidelines:",
  "url": "<a href='empirical.html'>",
  "Background":"background-color:red"
}, {
  "Chapter": "4",
  "Name": "Treatment of Malaria",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "5",
  "Name": "Antibiotic Prophylaxis:",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "6",
  "Name": "Aminoglycoside and Glycopeptide dosing and monitoring:",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "7",
  "Name": "Splenectomy: vaccination and antibiotic prophylaxis",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "8",
  "Name": "Restricted Antimicrobials",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "9",
  "Name": "Topical Antibiotics",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "10",
  "Name": "Antimicrobials and Renal Failure",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "11",
  "Name": "Antimicrobials and Hepatic Disease",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "12",
  "Name": "Administration of IV Antimicrobials",
  "url":"<a>",
  "Background":"background-color:red"
}, {
  "Chapter": "13",
  "Name": "Penicillin allergy & other beta-lactam containing antibiotics",
  "url":"<a>",
  "Background":"background-color:red"
}]
};

 var grid= new Array();
 grid[0]= "<div class='ui-block-a'>";
 grid[1]= "<div class='ui-block-b'>";
 grid[2]= "<div class='ui-block-c'>";
 grid[3]= "<div class='ui-block-d'>";
 var j=0;

$(document).on("pageinit", "#Page1", function(){

var toc= '';
$.each(json.tcontent, function(index, item) {
  if (j > 3) { j = 0; }
  toc += grid[j] + item.url + '<div class="grid">' + "<p class='gridtext'>" + item.Chapter + ":" + item.Name  + "</p>" +  "</div>" + "</a>" + "</div>"
  j++;
});

$(toc).appendTo(".ui-grid-c");

});

</script> 




</head>

 <body>
      <div data-role="page" data-theme="a" id="Page1">

        <div data-role="header" data-theme="c">
          <a data-rel="back" data-role="button" class="ui-btn-left" data-transition="flip" data-icon="back"> Back </a>
            <a href="info.html" data-role="button" class="ui-btn-right" data-transition="flip" data-icon="info"> Info </a>
            <h2>Main Menu</h2>
        </div>

        <div data-role="content" data-theme="c" id="Page1_Content">

        <div class="ui-grid-c">



        </div>

        <div data-role="footer" data-theme="c">
            <h2>(c) Darragh O'Connor </h2>
        </div>


    </div>


 </body>
</html>

如果有人知道为什么这不打印，我会非常感激。感谢

Javascript函数打印Json无法在Phonegap中运行

0 个答案: