Sweet Alert, но кнопки отключены в течение первых нескольких секунд - PullRequest
0 голосов
/ 28 ноября 2018

Я создаю Sweet Alert, который отображает очень важное сообщение, и я не хочу, чтобы пользователь отклонял его без чтения.

Поэтому, чтобы подчеркнуть важность сообщения, я хотел бы сделатькнопка OK отключена (скажем ...) на 5 секунд, поэтому пользователь должен подождать хотя бы это, прежде чем отключить предупреждение.

Видимый таймер тоже будет приятным.Я использую AngularJS в своем приложении.

Я мог бы легко создать пользовательский модал в качестве предупреждения для этой цели, но причина, по которой я хочу использовать Sweet Alert, заключается в том, что он уже используется во всем приложении, и я нене хочу нарушать шаблон.

Ответы [ 2 ]

0 голосов
/ 28 ноября 2018

Вы можете реализовать это, используя то, что уже доступно в SweetAlert2 .Как упоминалось в другом ответе Джозефа, вы должны установить для следующих свойств sweetalert2 значение false, чтобы пользователь не мог отклонить модальное значение:

allowOutsideClick: false,
allowEscapeKey: false, 

Затем можно скрыть кнопку подтверждения, когда отображается ласточка:

onOpen: () => {
  swal.showLoading()
  ....
}

, а затем через некоторое время снова нажмите кнопку подтверждения, используя setTimeout:

onOpen: () => {
  swal.showLoading()
  setTimeout(() => { swal.hideLoading() }, 5000)
}

. Полный код ласта будет:

swal({
  title: 'Please read this message!',
  allowOutsideClick: false,
  allowEscapeKey: false, 
  onOpen: () => {
    swal.showLoading()
    setTimeout(() => { swal.hideLoading() }, 5000)
  },
}).then((result) => {
  if (!result.dismiss) {
     console.log('user read the important message')
  }
})
0 голосов
/ 28 ноября 2018

Я думаю, что этот код - то, что вы ищете

var h = 1;

function run(){
  if(h==1){
    swal('hello','warning', {button: {closeModal: false}, closeOnEsc: false, closeOnClickOutside: false}).then(nnn => {if(h==1){
      run();
    }else{
      swal.close();
    }});
    setTimeout(function(){ h = 0;}, 5000);
  }
}

run();

Я уверен, что есть лучшие способы написать это, но это сработало для меня, просто установите таймер тайм-аута на любую длительностьВы хотите, чтобы он оставался открытым.

...