クイックスタート

このクイックスタートでは、Web ページの作成、wijcheckbox ウィジェットの追加、およびウィジェットの外観と動作のカスタマイズを行います。

テキストエディタで新規の HTML ページを作成するには、下記コードを追加して文章を .html の拡張子で保存します。
ドロップダウンしてマークアップをコピーします
テキストエディタに張り付けます
コードのコピー

<!DOCTYPE HTML> <HTML> <head> </head> <body> </body> </HTML>

テキストエディタに張り付けます	コードのコピー
<!DOCTYPE HTML> <HTML> <head> </head> <body> </body> </HTML>

CDN から最新の依存ファイルを参照するには、wijmo cdn を確認してください。これらを HTML ページの <head> タグ内に追加します。たとえば、次のようになります。

ドロップダウンからリファレンスをコピーして head タグ内に張り付けます

リファレンス	コードのコピー
<!--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" /> <!--RequireJs--> <script type="text/javascript" src="http://cdn.wijmo.com/external/require.js"></script>

<body> タグ内に、次のようにマークアップを追加します。<input> 要素はウィジェットを作成し、その type オプションは 'checkbox' に設定され、それを jQuery スクリプトに呼び出してウィジェットを初期化します。このマークアップは、ページに一連のチェックボックスとラベルを追加します。

ドロップダウンからマークアップをコピーして body タグ内に張り付けます

マークアップ	コードのコピー
<h3>To do list:</h3> <label><input type='checkbox'/>Create a web page.</label></br> <label><input type='checkbox' />Reference dependencies.</label></br> <label><input type='checkbox' />Add markup.</label></br> <label><input type='checkbox' />Initialize widget.</label></br> <label><input type='checkbox' />Save and view in a browser.</label>

<head> タグ内の参照の下に、次のスクリプトを追加して jQuery ウィジェットを初期化します。

ドロップダウンからスクリプトをコピーして head タグ内に張り付けます

HTML ファイルを保存し、それをブラウザで開きます。wijcheckbox ウィジェットは、次のように表示されます。

関連トピック

参照