jQuery+PHP打造滑动开关效果

                add_off.removeClass("ad_off").addClass("ad_on").attr("title","点击关闭");  
            }else{  
                alert(data);  
            }  
        });  
    });  
});

说明，代码中，首先实现了鼠标滑向功能列表换色的功能(详见demo)，然后就是单击开关按钮，向后台action.php发送Ajax请求，提交的参数是对应功能的id和type，用于后台区分请求的是哪个功能和请求的类型(开启和关闭)。其实，大家稍微留神，可以看出，根据Ajax请求成功返回结果后，开关按钮动态改变样式，实现改变开关状态的功能。

action.php

后台action.php接收到前端的请求，根据参数执行SQL语句，更新对应功能的状态，成功后将结果返回给前端，请看代码：

 
require_once('connect.php');   
$id = $_POST['status'];   
$type = $_POST['type'];   
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){   
    echo '1';   
}else{   
    echo '服务器忙，请稍后再试！';   
}

结束语通过本文您可以熟练掌握ajax在WEB开发中的应用，并能快速的应用到您的项目中。将一如既往的为广大开发者提供更具实用性的应用，致力于WEB前端技术的应用。