用php和js制作的一个简单方便的小说阅读程序
1、首先你的网站支持php程序,而且能自己添加php文件,如果这个条件满足了我们就可以进行下一步了。
2、我们来制作php文件,用dreamweaver新建一个php文件然后把下面的代码复制粘贴到里面,注意这里的代码是全部的,所以你粘贴时一定要把新建文件中的代码全部删除掉再粘贴。然后保存文件,给文件起一个英文的名字上传到你的网站空间,比如我起的名字是“mu.php”。代码如下(里面含有说明):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<?php
$cen=explode(" ",$_POST['mu']);//这里是接收表单中小说目录名称
$ur=explode(" ",$_POST['url']);//这里是接收表单中小说每一章节的链接地址
$shu=count($cen);//数组的数量,为下面的循环作参数
?>
<!--下面的代码是用js打开和关闭层用以来打开每一个章节----->
<script type="text/javascript">
function Ceng(url) {
document.getElementById('close').style.display = 'block';
document.getElementById('wen').src=url;
return false;
}
function closeCeng() {
document.getElementById('close').style.display = 'none';
return false;
}
</script>
<style type="text/css">
a{text-decoration:none;color:#000000;font-size:2em;}
body{background-color:#99CC00;}
</style>
<body>
<div style="position:absolute !important;left:30%;top:20px;z-index:1;padding:0px;width:50%;height:95%;text-align:left;overflow-y:auto;">
<?php
//这里用一个循环来输出小说的目录及链接
for ($x=0; $x<$shu; $x++) {
echo '<a href="javascript:void(0)"onclick="Ceng('.$ur[$x].')">'.$cen[$x].'</a>';
}
?>
</div>
<div id="close" style="position:absolute !important;z-index:2;left:1%;top:0px;background-color:#fff;padding:0px;display:none;width:98%;height:99%;text-align:right">
<button style="background:#CC3333;color:#FFFFFF;width:100%;font-size:2em;" onclick="closeCeng()">关闭</button>
<iframe id='wen' style="border:0px;" src="
</div>
</body>
</html>
3、接下来就是表单的代码了,只要我们把这段代码放在前台的文章里面,通过提交后便可自动生成小说的目录及内容链接了。注意的是目录名称及链接地址是对应的,不能一个多一个少,否则会出错。其中接收表单的网页地址要根据你的实际情况而定。代码如下:
<form action="mu.php" target="_blank" method="post">
<!--下面这个是用来定义小说目录的名称,注意每两个名称间要有空格-->
<input type="hidden" name="mu" value="第一章 第二章 第三章" />
<!--下面这个是用来定义每一章节的链接地址,网址是可以根据你的需要随意变换的,也要有空格-->
<input type="hidden" name="url" value="'http://baidu.com' 'http://duguyu.com' 'http://www.sina.com'" />
<input type="submit" value="进入阅读"/>