English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
このポップアッププラグインは、iOSの原生ポップアップを模倣して作成したカスタムプラグインで、AlertポップアップとConfirm確認ポップアップを含みます。タイトル、内容、ボタンテキスト、ボタンのリターン関数をカスタムで設定できます。非常に使いやすく、拡張も可能です。以下はプラグインの使用方法で、一見でわかります:
まず、jQueryライブラリ、プラグインライブラリ、CSSファイルをインポートします。
<script src="./jquery-1.8.3.min.js"></script> <script src="./jquery.confirm-1.1.js"></script> <link href="./jquery.confirm-1.1.css" rel="external nofollow" rel='stylesheet' type='text/css' />
Alert弹出框快速使用
$.alert('Are you sure to continue? --内容はHTMLコードをサポートしています $.alert({ title: 'Alertポップアップ!', --タイトル デフォルトタイトル(注意事項) content: 'Are you sure to continue? --内容 });
Alertコールバックポップアップの使用方法
$.alert({ title: 'Alertコールバックポップアップ!', content: 'alertにコールバック関数を含め、確認ボタンをクリックするとコールバック関数がトリガーされます', buttons: { ok: { text: 'いいえ', --ボタンのタイトル action: function () { --コールバックイベント alert("ボタンのコールバック関数が実行されました"); } } } });
Confirm確認ボックスの使用方法
$.confirm('Are you sure to continue? $.confirm({ title: 'Confirm確認ボックス!', content: 'Are you sure to continue? });
Confirmコールバック確認ボックスの使用方法
$.alert({ title: 'Confirmコールバック確認ボックス!', content: 'Confirm確認ボックス、ボタンをクリックするとコールバック関数がトリガーされます', buttons: { ok: { --確認ボタン text: '確認', action: function () { alert("確認ボタンのコールバック関数が実行されました"); } } close: { --閉じるボタン text: '閉じる', action: function () { alert("閉じるボタンのコールバック関数が実行されました"); } } } });
確認ボタンの配置が複数可能です
効果表示
使いやすそうですね -_-
ダウンロードリンク:https://pan.baidu.com/s/1pLJJky3
以上の説明は編集者が皆さんに紹介したjQueryのiOS風ポップアッププラグインであり、皆さんに役立つことを願っています。何かご不明な点があれば、コメントを残してください。編集者は皆さんの質問に迅速に回答します。また、呐喊教程サイトへのサポートに感謝しています。