Wijmo UI for the Web
クイックスタート
| Wijmo ユーザーガイド > ウィジェット > Rating > クイックスタート |
このクイックスタートでは、HTML マークアップおよび jQuery スクリプトを使用して、HTML プロジェクトに Rating ウィジェットを追加する方法について学びます。
ドロップダウンしてマークアップをコピーします
| テキストエディタに張り付けます |
コードのコピー |
|---|---|
<!DOCTYPE HTML> <HTML> <head> </head> <body> </body> </HTML> | |
ドロップダウンからリファレンスをコピーしてhead タグ内に貼り付けます
| リファレンス |
コードのコピー |
|---|---|
<!--jQuery References--> <script src="http://code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script> <script src="http://code.jquery.com/ui/1.11.0/jquery-ui.min.js" type="text/javascript"></script> <!--Theme--> <link href="http://cdn.wijmo.com/themes/aristo/jquery-wijmo.css" rel="stylesheet" type="text/css" /> <!--Wijmo Widgets CSS--> <link href="http://cdn.wijmo.com/jquery.wijmo-pro.all.3.20173.128.min.css" rel="stylesheet" type="text/css" /> <!--Wijmo Widgets JavaScript--> <script src="http://cdn.wijmo.com/jquery.wijmo-open.all.3.20173.128.min.js" type="text/javascript"></script> <script src="http://cdn.wijmo.com/jquery.wijmo-pro.all.3.20173.128.min.js" type="text/javascript"></script> | |
ドロップダウンからマークアップをコピーして body タグ内に貼り付けます
| マークアップ |
コードのコピー |
|---|---|
<div id="ratingRadio"> <label for="input1a"> Below Average</label> <input type="radio" id="input1a" value="1" name="rating" /> <label for="input2a"> Average</label> <input type="radio" checked="checked" id="input2a" value="2" name="rating" /> <label for="input3a"> Above Average</label> <input type="radio" id="input3a" value="3" name="rating" /> <label for="input4a"> Awesome</label> <input type="radio" id="input4a" value="4" name="rating" /> <label for="input5a"> Epic</label> <input type="radio" id="input5a" value="5" name="rating" /> </div> | |
ドロップダウンからスクリプトをコピーして head タグ内に貼り付けます
| スクリプト |
コードのコピー |
|---|---|
<script id="scriptInit" type="text/javascript"> $(document).ready(function () { $("#ratingRadio").wijrating(); }); </script> | |
全て展開
すべて折りたたむ