Question

我正在尝试使用插件自定义确认消息。我有php表记录，每行都有删除按钮。我如何自定义确认弹出窗口，就像下面的jquery插件一样？

<?php echo'
<tr class="record"> 
    <td align="center"><a href="#" id="'.$row["counter"].'" class="delbutton"><img src="images/del.png"></a></td></tr>';
?>
    <script>
        $(function() {
        $(".delbutton").click(function(){
        var element = $(this);
        var del_id = element.attr("id");
        var info = 'id=' + del_id;
         if(confirm("Are you want to continue ?"))
                  {
         $.ajax({
           type: "GET",
           url: "delete.php",
           data: info,
           success: function(){
           }
         });
                 $(this).parents(".record").animate({ backgroundColor: "#fbc7c7" }, "fast")
                .animate({ opacity: "hide" }, "slow");
         }
        return false;
        });
        });
    </script>

Jquery插件

<script>
$(function() {
$( "#dialog-confirm" ).dialog({
resizable: false,
height:140,
modal: true,
buttons: {
"Delete all items": function() {
$( this ).dialog( "close" );
},
Cancel: function() {
$( this ).dialog( "close" );
}
}
});
});
</script>
</head>
<div id="dialog-confirm" title="Empty the recycle bin?">
<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
</div>

Answer 1

如果您需要更多帮助，请询问。

"Delete all items": function() {
// insert your ajax here
$( this ).dialog( "close" );
},

参考：.dialog()

Answer 2

希望这会有所帮助：

  <?php echo'
  <tr class="record"> 
      <td align="center"><a href="#" id="'.$row["counter"].'" class="delbutton"><img src="images/del.png"></a></td></tr>';
  ?>
  <script>
      $(function() {
        $(".delbutton").click(function(){
            var element = $(this);
            var del_id = element.attr("id");
            var info = 'id=' + del_id;
            $( "#dialog-confirm" ).dialog({
                  resizable: false,
                  height:140,
                  modal: true,
                  buttons: {
                    "Delete all items": function() {                           
                       $.ajax({
                         type: "GET",
                         url: "delete.php",
                         data: info,
                         success: function(){
                            $(this).parents(".record").animate({ backgroundColor: "#fbc7c7" }, "fast").animate({ opacity: "hide" }, "slow");
                         }
                       }); 
                       $( this ).dialog( "close" );
                    },
                    Cancel: function() {
                      $( this ).dialog( "close" );
                      return false;
                    }
                  }
                }); // end Dialog         
            return false;
        }); // end .delbtn
    }); // end jquery load
  </script>

自定义确认弹出

2 个答案: