Как заставить JQuery UI Dialog всплывать с помощью функции else {}? - PullRequest
0 голосов
/ 10 февраля 2019

Я использую диалоговое окно jQuery UI.Этот код делает диалоговое окно всплывающим при нажатии кнопки HTML.

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
   <script>
  $( function() {
    $( "#dialog" ).dialog({
      autoOpen: false,
      show: {
        effect: "blind",
        duration: 1000
      },
      hide: {
        effect: "explode",
        duration: 1000
      }
    });

    $( "#opener" ).on( "click", function() {
  $( "#dialog" ).dialog( "open" );
});
  } );
  </script>
</head>
<body>

<div id="dialog" title="Basic dialog">
  <p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

<button id="opener">Open Dialog</button>


</body>
</html>

Это прекрасно работает, но у меня есть функция if else:

  if(form.pswrd.value === "password")
  {
  window.open('page.html')/*opens the target page while Id & password matches*/
  }
  else
  {
//jQuery Dialog opens HERE
  }
  }

Функция else внизу - это то, что я хочу вызватьДиалоговое окно jQuery UI.Как я могу заставить else открыть диалоговое окно jQuery?Я уже пробовал такие вещи, как включение этой части скрипта в мой else, но безрезультатно:

$( "#opener" ).on( "click", function() {
  $( "#dialog" ).dialog( "open" );
});
  } );

Ответы [ 3 ]

0 голосов
/ 10 февраля 2019

Вам не нужен слушатель щелчков, чтобы открыть его вручную

Просто сделайте:

else { 
   $( "#dialog" ).dialog( "open" );
}
0 голосов
/ 10 февраля 2019

Ваш код выглядит нормально, вам просто нужно вызвать диалоговое окно, открытое в предложении else:

<div id="dialog" title="Basic dialog">
  <p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

<button id="opener">Open Dialog</button>

<script>
$(function() {
  $("#dialog").dialog({
    autoOpen: false,
    show: {
      effect: "blind",
      duration: 1000
    },
    hide: {
      effect: "explode",
      duration: 1000
    }
  });

  $("#opener").on("click", function() {
    if (form.pswrd.value === "password") {
      window.open("page.html");
    } else {
      $("#dialog").dialog("open");
    }
  });
});
</script>
0 голосов
/ 10 февраля 2019
$( "#opener" ).on( "click", function() {
  if(form.pswrd.value === "password") {
      window.open('page.html'); /*opens the target page while Id & password matches*/
    } else {
      $( "#dialog" ).dialog( "open" );
    }
  }
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...