English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
以下の例では、jQueryプラグインeasyUIを使用してJSでDialogを表示する方法について分析しました。皆様に参考としてご提供します。以下の通りです:
<meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <title></title> <script src="jquery-easyui-1.3.4/jquery-1.8.0.min.js" type="text/javascript"></script> <script src="jquery-easyui-1.3.4/jquery.easyui.min.js" type="text/javascript"></script> <script src="jquery-easyui-1.3.4/locale/easyui-lang-zh_CN.js" type="text/javascript"></script> <link href="jquery-easyui-1.3.4/themes/icon.css" rel="stylesheet" type="text/css" /> <link href="jquery-easyui-1.3.4/themes/default/easyui.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $(function () { $("#myDialog").dialog({ modal: true, collapsible: true, //折り畳み可能に設定 toolbar: [{ //ツールバー配列の設定 text: '追加', iconCls: 'icon-add',}} handler: function () { $.messager.show({ showType: "fade", msg: "データを追加", title: "通知", timeout: 1000 }); } }, { text: '保存', iconCls: 'icon-save', handler: function () { $.messager.show({ showType: "fade", msg: "データを保存", title: "通知", timeout: 1000 }); } }], buttons: [{ //ボタン配列を設定します text: '提出', iconCls: 'icon-ok', handler: function () { $.messager.show({ showType: "fade", msg: "データを提出", title: "通知", timeout: 1000 }); } }, { text: 'キャンセル', iconCls: 'icon-cancel', handler: function () { } }] }); }); </script>
jQueryに関するさらに詳しい内容に興味を持つ読者は、以下の本サイトの特集をチェックしてください:《jQuery ウィンドウ操作の技術概要》、《jQuery ドラッグ効果と技術概要》、《jQuery 常用プラグインと使い方概要》、《jQuery Ajaxの使い方概要》、《jQuery テーブル(table)操作の技術概要》、《jQuery 拡張技術概要》、《jQuery 常見のクール効果概要》、《jQuery アニメーションと効果の使い方概要》および《jQuery セレクタの使い方概要》
本文の内容が皆様のjQueryプログラムデザインに役立つことを願っています。
声明:本文の内容はインターネットから取得され、著作権者は所有者であり、インターネットユーザーによって自発的に提供され、自己でアップロードされました。本サイトは所有権を持ちません。また、人工編集は行われていません。著作権侵害を疑われる内容が見つかった場合は、以下のメールアドレスまでご連絡ください:notice#oldtoolbag.com(メール送信時、#を@に変更して報告してください。関連する証拠を提供してください。一旦確認がとれましたら、本サイトは即座に侵害を疑われるコンテンツを削除します。)