jquery.confirm.js
Heim > Web-Frontend > js-Tutorial > Hauptteil

jquery 漂亮的删除确认和提交无刷新删除示例_jquery

WBOY
Freigeben: 2016-05-16 17:15:39
Original
969 Leute haben es durchsucht

本例数据库结构很简单,就一个字段就行了
jquery 漂亮的删除确认和提交无刷新删除示例_jquery 
jquery.confirm.js

复制代码 代码如下:

(function($){
$.confirm = function(params){
if($('#confirmOverlay').length){
// A confirm is already shown on the page:
return false;
}
var buttonHTML = '';
$.each(params.buttons,function(name,obj){
// Generating the markup for the buttons:
buttonHTML += ''+name+'';
if(!obj.action){
obj.action = function(){};
}
});
var markup = [
'
',
'
',
'

',params.title,'

',
'

',params.message,'

',
'
',
buttonHTML,
'
'
].join('');
$(markup).hide().appendTo('body').fadeIn();
var buttons = $('#confirmBox .button'),
i = 0;
$.each(params.buttons,function(name,obj){
buttons.eq(i++).click(function(){
// Calling the action attribute when a
// click occurs, and hiding the confirm.
obj.action();
$.confirm.hide();
return false;
});
});
}
$.confirm.hide = function(){
$('#confirmOverlay').fadeOut(function(){
$(this).remove();
});
}
})(jQuery);

PHP Code
复制代码 代码如下:


require "conn.php";
$sql="select * from `add_delete_record` where id>0";
$rs=mysql_query($sql);
if ($row = mysql_fetch_array($rs))
{
do {
?>

}
while ($row = mysql_fetch_array($rs));
}?>


JavaScript Code
复制代码 代码如下:

$(document).ready(function(){
$('.item .delete').click(function(){
var elem = $(this).closest('.item');
var id=$(this).attr('id');
$.confirm({
'title' : '删除该记录?',
'message' : '您确认删除该记录?
删除后无法恢复记录.',
'buttons' : {
'Yes' : {
'class' : 'blue',
'action': function(){$.ajax({
type: 'GET',
url: 'del.php',
data: 'id='+id,
});
elem.slideUp();
}
},
'No' : {
'class' : 'gray',
'action': function(){} // Nothing to do in this case. You can as well omit the action property.
}
}
});
});
});

del.php
复制代码 代码如下:

require "conn.php";
$id=$_GET['id'];
$delete_small_sql = "delete from add_delete_record where id='$id'";
$result_small = mysql_query($delete_small_sql);
?>
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage