[Globalize] タイムゾーンオフセット書式

by Wijmo5_jp

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.grapecity.com/wijmo/5.latest/styles/wijmo.min.css">
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.input.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/cultures/wijmo.culture.ja.min.js"></script>
<script src="https://demo.grapecity.com/wijmo/sample/scripts/sample.js"></script>
<link rel="stylesheet" href="https://demo.grapecity.com/wijmo/sample/styles/sample.css">
<div class="container">

  <h3>タイムゾーンオフセット書式</h3>
  <p>「z」、「zz」、「zzz」の書式指定子を使用して、日時のタイムゾーンオフセットの書式を設定します。</p>
  <table class="table table-striped">
    <thead>
      <tr>
        <th class="col-xs-3">書式</th>
        <th class="col-xs-9">値</th>
      </tr>
    </thead>
    <tbody id='tbody'>
    </tbody>
  </table>

</div>

JavaScript

var tbody = document.getElementById('tbody');
var date = new Date();

var template = '<tr><td>{format}</td><td>{result}</td></tr>';
var formats = 'yyyy/MM/dd H:mm z,yyyy/MM/dd H:mm zz,yyyy/MM/dd H:mm zzz'.split(',');
for (var i = 0; i < formats.length; i++) {
  var row = tbody.insertRow();
  row.innerHTML = wijmo.format(template, {
    format: formats[i],
    result: wijmo.Globalize.formatDate(date, formats[i])
  });
}