$(function(){
//鼠标滑向换color
$(".list").hover(function(){
$(this).addClass(" cur_select");
},function(){
$(this).removeClass("cur_select");
});
//关闭
$(". ad_on").live("click",function(){
var add_on = $(this);
var status_id = $(this).attr("rel");
$.post( "action.php",{status:status_id,type:1},function(data){
if(data==1){
add_on.removeClass("ad_on").addClass("ad_off") .attr("제목","点击开启");
}else{
경고(데이터);
}
});
});
//开启
$(".ad_off").live("click",function(){
var add_off = $(this);
var status_id = $(this).attr("rel");
$.post("action.php",{status:status_id,type:2},function(data){alert(data);
if(data==1){
add_off.removeClass( "ad_off").addClass("ad_on").attr("title","点击关闭");
}else{
경고(데이터);
}
});
});
});
说明,代码中,首先实现了鼠标滑向功能列表换color的功能(详见demo),然后就是单击开关按钮,向台action.php发送Ajax请求,提交 的参数是对应功能的id 와 유형, 사용은 于后台区分请求的是哪个功能和请求的类型(开启和关闭)입니다.返回 结果后,开关按钮动态改变样式,实现改变开关状态的功能。
action.php
后台action.php接收到前端的请求,根据参数执行SQL语句,更新对应功能的状态,成功后将结果返回给前端,请看代码:
require_once('connect.php');
$id = $_POST['상태'];
$type = $_POST['유형'];
if($type==1){ //关闭
$sql = "update pro set status=0 where id=".$id;
}else{ //开启
$sql = "update pro set status=1 where id=".$id;
}
$rs = mysql_query($sql);
if($rs){
에코 '1';
}else{
echo '服务器忙,请稍后再试!';
}