- 学校新闻
-
jQuery和PHP打造功能开关效果
在开发项目中,我们会经常碰到需要及时开启某项功能的情况,*Ajax实现实时开启和关闭功能,无疑增强了用户体验。本文以360安全卫士的木马防火墙开关为背景,使用PHP、jquery、MYSQL实现了及时开启和关闭产品功能的WEB应用。
准备工作
为了更好的演示本例,我们需要一个数据表,记录需要的功能说明及开启状态,表结构如下:
- CREATE TABLE `pro` (
- `id` int(11) NOT NULL auto_increment,
- `title` varchar(50) NOT NULL,
- `description` varchar(200) NOT NULL,
- `status` tinyint(1) NOT NULL default '0',
- PRIMARY KEY (`id`)
- ) ENGINE=MyISAM DEFAULT CHARSET=utf8;
你可以向表中pro插入几条数据。
index.php
我们要在页面显示相关功能列表,使用PHP读取数据表,并以列表的形式展示。
- <?php
- require_once('connect.php'); //连接数据库
- $query=mysql_query("select * from pro order by id asc");
- while ($row=mysql_fetch_array($query)) {
- ?>
- < class="list">
- < class="fun_title">
- <span rel="<?php echo $row['id'];?>" <?php if($row['status']==1){ ?>
- class="ad_on" title="点击关闭"<?php }else{?>class="ad_off" title="点击开启"<?php }?>></span>
- <h3><?php echo $row['title']; ?></h3>
- </>
- <p><?php echo $row['description'];?></p>
- </>
- <?php } ?>