jquery uiダイアログはインスタンスの確認を置き換えますanalyze

jquery uiダイアログはインスタンスの確認を置き換えますanalyze_jquery

WBOY

リリース： 2016-05-16 15:18:10

オリジナル

1425 人が閲覧しました

この記事の例では、jquery ui ダイアログが確認を置き換える方法について説明します。参考のために皆さんと共有してください。詳細は次のとおりです:

一部のブラウザでは js の確認機能が直接ブロックされ、機能が使用できなくなります。確認機能を完全に置き換えるには、jquery ui のダイアログ機能を使用することをお勧めします。

1. HTML コード

<div id="confirm_dialog" title="提示" style="display:none;">
</div>

ログイン後にコピー

上記のコードを公共の場所に置きます

2. 確認用の JS コードをシミュレートします

var common = {
  confirm_act:function(dialog_id,msg,callback) {
    $("#"+dialog_id).html("<p class='message'>"+msg+"</p>");
    $("#"+dialog_id).dialog({
      resizable: false,
      modal: true,
      overlay: {
        backgroundColor: '#000',
        opacity: 0.5
      },
      buttons: {
        '确认': function() {
          callback.call();
          $(this).dialog('close');
        },
        '取消': function() {
          $(this).dialog('close');
        }
      }
     });
  }
}

ログイン後にコピー

メソッドconfirm_act が定義され、パブリック js ファイルに配置されます。最初のパラメーターはエラスティックレイヤーの ID、2 番目のパラメーターはプロンプトメッセージ、3 番目のパラメーターはコールバック関数です。
コールバック関数を呼び出すときは、js の call() 関数を使用する必要があることに注意してください。このコールバック関数はパラメータを受け取ることも、コールバック関数を含めることもできます。

3. コールバック js コード

var recommend = {
  delete: function(url,obj)
  {
    $.ajax({
      url: url,
      type: "get",
      success:function(data)
      {
        ............省略..........
      }
    });
  }
}

ログイン後にコピー

の呼び出し方法

$('.recommended_delete').click(function(){
  var obj = this;  //重命名
  common.confirm_act('confirm_dialog',$(obj).attr('msg'),function(){recommend.delete($(obj).attr('url'),obj)});
});

ログイン後にコピー

これを関数で渡したい場合は、必ず を再定義してください。

さらに jQuery 関連のコンテンツに興味のある読者は、このサイトの特別トピック「jQuery の一般的なプラグインと使用法の概要」

をチェックしてください。

この記事が jQuery プログラミングのすべての人に役立つことを願っています。