Подтвердить что ты не робот

Как создать пользовательский "подтвердить" и приостановить выполнение js до тех пор, пока пользователь не нажмет кнопку?

Хорошо, я делаю кучу материалов RIA/AJAX и вам нужно создать "симпатичный", настраиваемый флажок подтверждения, который является DIV (не встроенным подтверждением javascript). У меня возникли проблемы с определением того, как выполнить паузу в выполнении, чтобы дать пользователю возможность принять или отклонить условие до возобновления или прекращения выполнения. (в зависимости от их ответа)

Итак, вот общий поток логики, с которым я имею дело:

  • Пользователь выбирает элемент из раскрывающегося списка и кнопки кликов.
  • В обработчике событий javascript на стороне клиента для кнопки мне нужно проверить (это ключ) СЕРИЯ условий для элемента, который они выбрали в раскрывающемся списке.
  • Эти условия могут привести к тому, что вообще не будут отображаться какие-либо подтверждения или, возможно, только некоторые из условий могут оцениваться как истинные, что означает, что мне нужно будет попросить пользователя принять или отклонить условие перед продолжением. Одновременно следует показывать только одно подтверждение.

Чтобы продемонстрировать логику:

function buttonEventHandler() {

if (condition1) {
  if(!showConfirmForCondition1) // want execution to pause while waiting for user response.
     return; // discontinue execution
}

if (condition2) {
  if (!showConfirmForCondition2) // want execution to pause while waiting for user response.

     return; // discontinue execution
}

if (condition3) {
  if (!showConfirmForCondition3) // want execution to pause while waiting for user response.

     return; // discontinue execution
}

...  
}

Если кто-то раньше рассматривал этот вызов и нашел решение, с благодарностью следует с благодарностью. В качестве примечания я также использую библиотеки MS Ajax и jQuery, хотя я не нашел никаких функций, которые могут быть уже включены в те, для этой проблемы.

4b9b3361

ОТВЕТЫ

Ответ 1

Я боюсь сказать, что невозможно приостановить время работы Javascript так же, как в диалоговых окнах "подтвердить" и "предупреждение" приостановить его. Чтобы сделать это с помощью DIV, вам придется разбить свой код на несколько фрагментов и обработчик событий в пользовательском поле подтверждения вызовет следующий раздел кода.

Были некоторые проекты, чтобы включить поддержку "продолжений" в Javascript, например описательный Javascript, поэтому, если вы действительно заинтересованы в ее получении для работы в одном блоке кода вы могли бы изучить это.

Ответ 2

Как я это сделал:

  • Создайте собственное диалоговое окно подтверждения с кнопками, скажем "Да" и "Нет" .
  • Создать функцию, которая запускает диалоговое окно, скажем confirmBox(text, callback).
  • Привязать события к "Да" и "Нет" кнопок - "Да" - callback(true), "Нет" - callback(false).

  • Когда вы вызываете функцию используйте этот синтаксис:

    confirmBox("Are you sure", function(callback){
    if (callback) {
        // do something if user pressed yes
    } 
    else {
        // do something if user pressed no
    }
});

Ответ 3

Попробуйте это, передайте вашу клиентскую функцию javascript объект 'this' и запустите свой пользовательский диалог подтверждения, но всегда возвратите false, чтобы предотвратить перезапуск обратной передачи. Однако, прежде чем вы выходите из функции обработки, скопируйте релевантную информацию, чтобы запустить обратную передачу вручную в свою пользовательскую кнопку подтверждения "Да".

Ответ 4

В моем случае целью было отображать окно customConfirm всякий раз, когда пользователь нажимает ссылку удаления, встроенную в каждую строку ретранслятора .Net

Всякий раз, когда пользователь нажимает ссылку удаления какой-либо конкретной строки, вызывается функция пользовательского подтверждения. Теперь в функции подтверждения, помимо рендеринга нового окна, необходимо выполнить следующие 2 действия:

// obtain the element(we will call it targetObject) that triggered the event

targetObject = (event.target==undefined ? event.srcElement : event.target);

// include a call to _doPostBack in the onclick event of OK/YES button ONLY

(targetObject.href!=undefined){ eval(targetObject.href); } else{ _doPostBack(targetObject.name,''); // it is assumed that name is available

Вышеприведенная конструкция if/else относится к моему случаю. Главное - просто знать, что вы можете моделировать паузу подтверждения и непрерывность, используя объект события и __doPostBack.

Ответ 5

как сказал Пол... это работает для меня (я думаю, вы используете ASP.NET, но если нет, вы можете легко переписать это):

function BeforeDelete(controlUniqueId) {
    confirmPopup('question...?', function() { __doPostBack(controlUniqueId, ''); });
    return false;
}

function confirmPopup(message, okCallback) {
    $('#popup-buttons-confirm').click(okCallback);
    // set message
    // show popup
}

Ответ 6

Ознакомьтесь с моим модульным полем предупреждения Fiddle: http://jsfiddle.net/katiabaer/UXM9y/33/ с JqueryUI modal

   showAlert = function (msg, header, callback) {
      var mydiv = $("<div id='mydiv'> </div>");
      mydiv.alertBox({
          message: msg,
          header: header,
          callback: callback
      });

  },

  $('#show').click(function () {
      var m = $('#message').val();
      var h = $('#header').val();
      var callback = function () {
          alert("I can do anything here");
      }
      showAlert(m, h, callback);

  });

  $.widget("MY.alertBox", {
      options: {
          message: "",
          header: "",
          callback: ''
      },

      _create: function () {
          var self = this;
          self.callback = self.options.callback;

          self.container = $(".alert-messagebox");
          var header = self.container.find(".alert-header");
          header.html(self.options.header);

          var message = self.container.find(".alert-message");
          message.html(self.options.message);

          var closeButton = self.container.find("button.modal-close-button");
          closeButton.click(function () {
              self.close();
          });

          self.show();
      },

      show: function () {
          var self = this;
          self.container.modal({
              maxWidth: 500
          });
      },

      close: function () {

          if (this.callback != null) {
              this.callback();
              $.modal.close();
              return;
          }
          $.modal.close();

      },

      destroy: function () {
          $.Widget.prototype.destroy.call(this);
      }

  });