7

これは私の HTML コードです ユーザーが任意のボタンをクリックしたときに甘いアラートを表示したい 2 つの入力ボタンがあります

<tr class="examples odd" id="UserId_1" role="row">
   <td class="sorting_1">1</td>
   <td>admin</td><td>Mohammad</td>
   <td>Farzin</td><td class="warning"><input type="button"
   value="Delete" class="sweet-5" id="btn_Delete1"></td>
</tr>
<tr class="examples even" id="UserId_5" role="row">
   <td class="sorting_1">2</td>
   <td>11</td><td>11</td>
   <td>11</td><td class="warning"><input type="button" value="Delete" class="sweet-5"
   id="btn_Delete5"></td>
</tr>

脚本

$(document).ready(function () {
document.querySelector('td.warning input').onclick = function () {
    swal({
        title: "Are you sure?",
        text: "You will not be able to recover this imaginary file!",
        type: "warning",
        showCancelButton: true,
        confirmButtonClass: 'btn-danger',
        confirmButtonText: 'Yes, delete it!',
        cancelButtonText: "No, cancel plx!",
        closeOnConfirm: false,
        closeOnCancel: false
        },
     function (isConfirm) {
        if (isConfirm) {
            swal("Deleted!", "Your imaginary file has been deleted!", "success");
            } else {
                swal("Cancelled", "Your imaginary file is safe :)", "error");
            }
        });
    };

});

最初の入力ボタンだけに Sweet Alert が表示されるが、2 番目のボタンをクリックしても何も起こらない

4

7 に答える 7

4

これを試して

$(document).ready(function () {
  $('body').on('click', 'td.warning input', function () {
    swal({
        title: "Are you sure?",
        text: "You will not be able to recover this imaginary file!",
        type: "warning",
        showCancelButton: true,
        confirmButtonClass: 'btn-danger',
        confirmButtonText: 'Yes, delete it!',
        cancelButtonText: "No, cancel plx!",
        closeOnConfirm: false,
        closeOnCancel: false
      },
      function (isConfirm) {
        if (isConfirm) {
          swal("Deleted!", "Your imaginary file has been deleted!", "success");
        } else {
          swal("Cancelled", "Your imaginary file is safe :)", "error");
        }
      });
  });
});

フィドルをチェック

http://jsfiddle.net/hoja/5a6x3m36/5/

于 2015-01-08T08:17:23.833 に答える
2

任意のボタンのクリックで甘いアラートが必要な場合は、次のようにコードを変更します。

$(document).ready(function(){
  $(document).on('click', 'button', function(){
    Swal.fire({     
       type: 'success',
       title: 'Your work has been done',
       showConfirmButton: false,
       timer: 1500
    })
  });
});
于 2019-05-28T04:14:11.700 に答える
1

スイートアラートを使用すると、より簡単になります。たとえば、onclick関数を呼び出すために必要なリンクをお気に入りにし、sweetalser.csssweetalert.min.jsが含まれていることを確認してください。これが機能することを願っています

<a onclick="sweetAlert('Greetings', 'Hi', 'error');" class="" data-toggle="modal" href='#modale-id'><i class="fa fa-fw fa-plus"></i>Streams</a>
于 2015-06-25T09:14:36.867 に答える
0

セレクターに一致する最初の要素のみを選択している'td.warning input'ため、2 番目の要素には何も起こりません。

方法を試すquerySelectorAll('td.warning input')。これは配列を返し、配列をループしてイベント リスナーを設定できます。

于 2015-01-08T08:06:27.177 に答える
0

window.onload=関数()

{

  swal({   title: "PopOutTitle",   text: "Your FIRST Name:",   type: "input",   showCancelButton: true, OnConfirm:school();  
         animation: "slide-from-top",     inputPlaceholder: name }, function(inputValue){   if (inputValue === false) return false;
         if (inputValue === "") { swal.showInputError("You need to write something!"); return false } 
           document.getElementById("name").innerHTML=inputValue || "Unknown";

});


 }

関数学校（）{

  swal({   title: "PopOutTitle",   text: "Your last Name:",   type: "input",   showCancelButton: true,   
         animation: "slide-from-top",     inputPlaceholder: name }, function(inputValue){   if (inputValue === false) return false;
         if (inputValue === "") { swal.showInputError("You need to write something!"); return false } 
           document.getElementById("name").innerHTML=inputValue || "Unknown";

});**I want to show multiple swal popout so I want to call the school function when Ok Button is clicked. How can I do this?**
于 2015-07-04T04:33:01.193 に答える