javascript - Json 未使用日期脚本显示在表格中

Question

当 var 指向 json 数据时，下面的脚本与 json 一起使用，但我需要它与 json 文件一起使用，该文件设置如下：

  0 (top level) > 0 (January) > 1 (1st of each month) Final is the json data:

 var json = [{
    "d_date": "22nd",
    "fajr_begins": "John Doe",
    "fajr_jamah": "10",
    "Sunrise_begins": "1",
    "Zuhur_jamah": "Jane Smith",
    "Zuhur_begins": "15",
    "Jummah_begins": "2",
    "Jummah_jamah": "Chuck Berry",
    "Asr_begins": "12",
    "Asr_jamah": "2"
  }];

json 数据将使用从 json 文件中选择的时间码显示

  var currentTime = new Date()
  var month = currentTime.getMonth()
  var day = currentTime.getDate()
  var dv = ('0' + '/' + month + '/' + day)

  var json = (src= 'json/file.json')

$(document).ready(function() {
  
  var tr;
  for (var i = 0; i < json.length; i++) {
    tr = $('<tr/>');
    tr.append("<tr> <th colspan='4'>Daily Prayer Times</th> </tr>");
    tr.append("<tr> <th rowspan='8' bgcolor='#4da6ff'>" + json[i].d_date + "</th> <th> Prayer </th> <th> Start </th> <th> Jammat </th> </tr>");
    tr.append("<tr> <th>Fajr</th> <td>" + json[i].fajr_begins + "</td> <td>" + json[i].fajr_jamah + "</td> </tr>");
    tr.append("<tr> <th>Sunrise</th> <td>" + json[i].Sunrise + "</td> <td>" + json[i].Sunrise + "</td> </tr>");
    tr.append("<tr> <th>Zuhur</th> <td>" + json[i].Zuhur_begins + "</td> <td>" + json[i].Zuhur_jamah + "</td> </tr>");
    tr.append("<tr> <th>Jummah</th> <td>" + json[i].Jummah_begins + "</td> <td>" + json[i].Jummah_jamah + "</td> </tr>");
    tr.append("<tr> <th>Asr</th> <td>" + json[i].Asr_begins + "</td> <td>" + json[i].Asr_jamah + "</td> </tr>");
    tr.append("<tr> <th>Magrib</th> <td>" + json[i].Maghrib_begins + "</td> <td>" + json[i].Maghrib_jamah + "</td> </tr>");
    tr.append("<tr> <th>Isha</th> <td>" + json[i].Isha_begins + "</td> <td>" + json[i].Isha_jamah + "</td> </tr>");
    $('#djprayer2').append(tr);
  }
});

/*json content below*/

table,
th,
td,
tr {
  border: 1px solid black;
  padding: 0px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="djprayer2"></table>

标签： javascripthtmljsoncordova

Answer 1

你有很多参考错误和额外的[ ] 在javascript[]中是一个数组并且{}是一个对象

$(document).ready(function() {

  var currentTime = new Date()
  var month = currentTime.getMonth()
  var day = currentTime.getDate()
  var dv = ('0' + '/' + month + '/' + day)

  var json = 
    [
       {
        "asr_jamah": "",
        "asr_mithl": "2:18 PM",
        "d_date": "1st",
        "fajr_begins": "6:09 AM",
        "fajr_jamah": "",
        "isha_begins": "6:10 PM",
        "isha_jamah": "",
        "Jummah_begins": "",
        "jummah_prayer_jamah": "13:30",
        "maghrib_begins": "4:05 PM",
        "maghrib_jamah": "4:10 PM",
        "Sunrise_begins": "8:13 AM",
        "Zuhur_begins": "12:09 PM",
        "zuhr_jamah": "1:30pm"
      }
    ]
  
  var tr;
  for (var i = 0; i < json.length; i++) {
    tr = $('<tr/>');
    tr.append("<tr> <th colspan='4'>Daily Prayer Times</th> </tr>");
    tr.append("<tr> <th rowspan='8' bgcolor='#4da6ff'>" + json[i].d_date + "</th> <th> Prayer </th> <th> Start </th> <th> Jammat </th> </tr>");
    tr.append("<tr> <th>Fajr</th> <td>" + json[i].fajr_begins + "</td> <td>" + json[i].fajr_jamah + "</td> </tr>");
    tr.append("<tr> <th>Sunrise</th> <td>" + json[i].Sunrise_begins + "</td> <td>" + json[i].Sunrise_begins + "</td> </tr>");
    tr.append("<tr> <th>Zuhur</th> <td>" + json[i].Zuhur_begins + "</td> <td>" + json[i].Zuhur_jamah + "</td> </tr>");
    tr.append("<tr> <th>Jummah</th> <td>" + json[i].Jummah_begins + "</td> <td>" + json[i].Jummah_jamah + "</td> </tr>");
    tr.append("<tr> <th>Asr</th> <td>" + json[i].Asr_begins + "</td> <td>" + json[i].Asr_jamah + "</td> </tr>");
    tr.append("<tr> <th>Magrib</th> <td>" + json[i].Magrib_begins + "</td> <td>" + json[i].Magrib_jamah + "</td> </tr>");
    tr.append("<tr> <th>Isha</th> <td>" + json[i].Isha_begins + "</td> <td>" + json[i].Isha_jamah + "</td> </tr>");
    $('#djprayer2').append(tr);
  }
});

table,
th,
td,
tr {
  border: 1px solid black;
  padding: 0px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="djprayer2"></table>