用php和js制作的一个简单方便的小说阅读程序

2025-10-23 05:35:48

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="进入阅读"/>

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢