1

私は現在これを持っています：

            $('form#uwbhandler').on('click', function(e){
            e.preventDefault();
            alertify.confirm("Mode 1",
              function(){
                alertify.success('Sent: Success Something');
                socket.emit('send command', {data: 'acommand'});
              },
              function(){
                alertify.success('Sent: Something');
                socket.emit('send command', {data: 'bcommand'});
              }).setHeader('<em>Select Mode</em> ').setting('labels',{'ok':'Mode 1', 'cancel': 'Mode 2'}).set({onshow:null, onclose:function(){ alertify.message('confirm was closed.')}});;
        });

これは主に、alertify.js ページの例から取られています。ただし、onclose ボタンとは別に、キャンセル ボタンのアクションをカスタマイズしたいと考えています。ただし、ダイアログの「x」ボタンで閉じると、別の onclose 関数を設定した後にキャンセル イベント イベントが発生します。

4

1 に答える 1

1

Dialog Factoryを使用してカスタム ダイアログを作成することをお勧めします。

確認ダイアログの定義は、ダイアログを閉じるときにキャンセル アクションを呼び出すように設定されています。

ただし、簡単な解決策は、既存の確認setupダイアログから継承し、それを無効に更新することinvokeOnCloseです。

alertify.dialog('myCustomDialog', function() {
  return {
    setup: function() {
      return {
        buttons: [{
          text: 'Mode 1',
          key: 13 /*keys.ENTER*/ ,
          className: alertify.defaults.theme.ok,
        }, {
          text: 'Mode 2',
          key: 27 /*keys.ESC*/ ,
          invokeOnClose: false, // <== closing won't invoke this
          className: alertify.defaults.theme.cancel,
        }],
        focus: {
          element: 0,
          select: false
        },
        options: {
          title: '<em>Select Mode</em> ',
          maximizable: false,
          resizable: false
        },
      };
    }
  }
}, false, 'confirm');

onclose次に、ローカル変数を使用して、コールバック内でロジックを実行するかどうかを決定します。

function demo() {
  var modeSelected = false;
  alertify.myCustomDialog("Which mode will it be?",
      function() {
        modeSelected = true;
        alertify.success('Mode 1');
      },
      function() {
        modeSelected = true;
        alertify.success('Mode 2');
      }
    )
    .set({
      onshow: null,
      onclose: function(arg) {
        if (!modeSelected) {
          alertify.message('confirm was closed.');
        }
        modeSelected = false;
      }
    });
}

ライブデモを見る

于 2016-05-03T14:46:53.523 に答える