如何使用 sweetalert 创建模态警报？

Question

我是 Javascript 的初学者，当我点击我页面上的 menu2 以 return 一条消息时，我需要为用户生成一个警报，为此我选择使用模态插件与所有浏览器兼容Plugin modal 到现在为止，我只能得到下面的代码，但没有成功。这是我的 html

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

<ul id='menu'>
  <li id='menu1'><a href='/web/front/helpdesk.public.php' title="Home" class='itemP'>Home</a>
  </li>
  <li id='menu2'><a href='/web/front/helpdesk.public.php' title="Cria um chamado" class='itemP'>Cria um chamado</a>
  </li>
  <li id='menu3'><a href='/web/front/ticket.php' title="Chamados" class='itemP'>Chamados</a>
  </li>
  <li id='menu4'><a href='/web/front/reservationitem.php' title="Reservas" class='itemP'>Reservas</a>
  </li>
  <li id='menu5'><a href='/web/front/helpdesk.faq.php' title="FAQ" class='itemP'>FAQ</a>
  </li>
</ul>

这是我的 javascript

echo '<script type="text/javascript">';
  echo'setTimeout(function () {
  swal
  ("Return the alert test !",
  "Message!",
  "success");';
  echo '}, 1000);
  </script>';

Return 正在处理页面上的警报。

我试过这种方法，但到目前为止没有成功。

     echo '<script type="text/javascript">';
  echo'setTimeout(function () {
  echo '$(document).ready(function() {
  echo '$('#menu2').click(function(event) { 
  swal
  ("Return the alert test !",
  "Message!",
  "success");';
  echo '}, 1000);
  </script>';

尝试运行我的 php 中的解决方案时出错。

我不想调用方法，事件的默认操作不会触发。为此，请使用 event.preventDefault ();但这对我不起作用。警报不会出现。有人有解决办法吗？

echo '<script type="text/javascript">';
echo '$(document).ready(function(){';
echo '    $("#menu2").click(function(event){'; 
echo '            event.preventDefault()';        
echo '        swal("Return the alert test !", "Message!", "success")';
echo '    })';
echo '});';
echo '</script>';

Answer 1

您的原始 jquery 应该如下所示（正确关闭的函数）：

$(document).ready(function(){
    $('#menu2').click(function(event){ 
        swal("Return the alert test !", "Message!")
    })
});

无论您如何回应，都由您决定。此外，您不需要使用 document.ready().

来设置 setTimeout()

编辑：

echo '<script type="text/javascript">';
echo '$(document).ready(function(){';
echo '    $("#menu2").click(function(event){';
echo '        swal("Return the alert test !", "Message!")';
echo '    })';
echo '});';
echo '</script>';

Answer 2

我能够使模态警报 sweetalert work by following the responses obtained here. I had a better understanding of Javascript and in specific event.preventdefault 进入下面的代码，它对我来说非常有效。

?>
<script type="text/javascript">
  $(document).ready(function() {
    $("#menu2").click(function(event) {
      event.preventDefault();
      swal("Many thanks to everyone for making me a better programmer.!", "Message", "success");
    })
  });
</script>
<?php

如何使用 sweetalert 创建模态警报？

How to create modal alert using sweetalert?

javascript

sweetalert