开发一个简单网站–第三章:相知

导读:本篇文章讲解 开发一个简单网站–第三章:相知,希望对大家有帮助,欢迎收藏,转发!站点地址:www.bmabk.com

<12>.搜索用户search.php

在这里插入图片描述
在这里插入图片描述

<?php
session_start();
if(isset($_SESSION['userid'])){

}else{
    header("Location: loginto.php");
}
?>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>龙星通信主页</title>
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <!-- Bootstrap -->
            <link href="bootstrap-3.0.0/dist/css/bootstrap.min.css" rel="stylesheet" media="screen">
    </head>
    <body>
        <style src="into/custom.css"></style>

        <div id="fb-root"></div>
        <script type="text/javascript">
            (function(d, s, id) {
                var js, fjs = d.getElementsByTagName(s)[0];
                if (d.getElementById(id)) return;
                js = d.createElement(s); js.id = id;
                js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
                fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));   
        </script>
       
        <!-- 创建导航 -->
        <!-- 创建导航 -->
        <div>
            <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
            <div class="collapse navbar-collapse">
                <ul class="nav navbar-nav">
                <li><a href="home.php" class="navbar-brand"><span class="glyphicon glyphicon-globe"></span></a></li>
                <li><a href="home.php"><span class="glyphicon glyphicon-home">主页</span></a></li>
                <li class="active"><a href="#"><span class="glyphicon glyphicon-search">搜索</span></a></li>
                <li><a href="fourum.php"><span class="glyphicon glyphicon-globe">论坛</span></a></li>            
                <li><a href="collection.php"><span class="glyphicon glyphicon-star-empty">收藏</span></a></li>
                <li><a href="geteml.php"><span class="glyphicon glyphicon-envelope">收信箱</span></a></li>
                <li><a href="posteml.php"><span class="glyphicon glyphicon-pencil">写信箱</span></a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-wrench">设置</span><b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li class="socials"><g:plusone annotation="inline" width="150"></g:plusone></li>
                        <li class="socials"><div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-width="The pixel width of the plugin" data-height="The pixel height of the plugin" data-colorscheme="light" data-layout="standard" data-action="like" data-show-faces="true" data-send="false"></div></li>
                        <li class="socials"><a href="settings.php" class="twitter-share-button"><span class="glyphicon glyphicon-user">个人信息设置</span></a>                          
                    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></li>
                    </ul>
                    <li class="dropdown">
                        <a href="#" class="glyphicon glyphicon-user" data-toggle="dropdown">我的<b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a id="action-1" href="#">用户名:
                                <?php
                                    $userid = $_SESSION['userid'];
                                    $conn = mysqli_connect();
                                    $check_query = mysqli_query($conn,"SELECT username,account FROM users WHERE id='$userid'");
                                    $row = mysqli_fetch_array($check_query);
                                    echo $row[0].'</a></li> 
                                        <li><a href="#">帐户:'.$row[1].'</a></li> <li class="divider"></li>';
                                ?>                                                       
                        </ul>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="glyphicon glyphicon-time" data-toggle="dropdown">时针<b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a id="action-1" href="#"><?php echo date('Y-m-d h:i:s',time());?></a></li>                               
                        </ul>
                    </li>                   
                </ul>

                <ul class="nav navbar-nav navbar-right"> 
                    <li><a href="loginto.php"><span class="glyphicon glyphicon-log-in"></span> 登录</a></li> 
                    <li><a href="reginto.php"><span class="glyphicon glyphicon-user"></span> 注册</a></li> 
                </ul>
                </div>
            </nav>
        </div>
        <br><br><br>
        <!---->
        <script>
            function showHint(str){
                if (str.length==0)
                { 
                    document.getElementById("txtHint").innerHTML="";
                    return;
                }
                if (window.XMLHttpRequest)
                {
                    // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行的代码
                    xmlhttp=new XMLHttpRequest();
                }
                else
                {	
                    //IE6, IE5 浏览器执行的代码
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
                xmlhttp.onreadystatechange=function()
                {
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                        document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
                    }
                }
                xmlhttp.open("GET","https://www.test.com/NB/self/Admin/getsearchdata.php?q="+str,true);
                xmlhttp.send();
            }
        </script>

        <p align = "center">
            <button type="button" class="btn btn-info">
                <span class="glyphicon glyphicon-search">搜索好友:</span>
            </button>
            <br><b>在输入框中输入好友用户名/帐户:</b></p>
            <form align = "center"> 
                姓名: <input type="text" onkeyup="showHint(this.value)">
            </form>
        <p align = "center">返回值: <span id="txtHint"></span></p>


        

        <!-- 模态框(Modal) -->
        <p align = "center">
            <h2>模态框(Modal)插件事件</h2>
            <!-- 按钮触发模态框 -->
            <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">开始演示模态框</button>
            <!-- 模态框(Modal) -->
            <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                            <h4 class="modal-title" id="myModalLabel">模态框(Modal)标题</h4>
                        </div>
                        <div class="modal-body">点击关闭按钮检查事件功能。</div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                            <button type="button" class="btn btn-primary">提交更改</button>
                        </div>
                    </div><!-- /.modal-content -->
                </div><!-- /.modal-dialog -->
            </div>
            <!-- /.modal -->
            <script>
            $(function() {
                $('#myModal').modal('hide')
            });
            </script>
            <script>
            $(function() {
                $('#myModal').on('hide.bs.modal',
                function() {
                    alert('嘿,我听说您喜欢模态框...');
                })
            });
            </script>
        </p>

        <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script> 
        <script src="bootstrap-3.0.0/dist/js/bootstrap.min.js"></script>

        <hr>
        <p align = "center">龙星通信@2020 by ToDo App.</p>
    </body>
</html>

<13>.搜索用户后台getsearchdata.php

<?php
include("db-creds.inc");
$conn = mysqli_connect($host,$dbuser,$dbpass,$dbname);
if (!$conn) {
    die("连接失败: " . mysqli_connect_error());
    echo '连接失败:'.mysqli_connect_error();
}

header('Access-Control-Allow-Origin:*');
session_start();
if(isset($_SESSION['userid'])){
    $getid = $_SESSION['userid'];
}else{
    header("Location: login.html");
}
         
$result = mysqli_query($conn,"SELECT * FROM users where 1 ORDER BY id DESC");
while ($row = mysqli_fetch_assoc($result)){
	$a[] = $row['username'].'(用户名)';
	$a[] = $row['account'].'(帐号)';
}			
			
//从请求URL地址中获取 q 参数
$q=$_GET["q"];

//查找是否由匹配值, 如果 q>0
if (strlen($q) > 0)
{
	$hint="";
	for($i=0; $i<count($a); $i++)
	{
		if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
		{
			if ($hint=="")
			{
				$hint=$a[$i];
			}
			else
			{
				$hint=$hint." , ".$a[$i];
			}
		}
	}
}

// 如果没有匹配值设置输出为 "no suggestion" 
if ($hint == "")
{
	$response="没有匹配值";
}
else
{
	$response=$hint;
}

//输出返回值
echo $response;
?>

<14>.搜索论坛(投票)fourum.php

在这里插入图片描述
在这里插入图片描述

<?php
session_start();
if(isset($_SESSION['userid'])){
    $getid = $_SESSION['userid'];
}else{
    header("Location: loginto.php");
}
?>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>龙星通信主页</title>
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <!-- Bootstrap -->
            <link href="bootstrap-3.0.0/dist/css/bootstrap.min.css" rel="stylesheet" media="screen">
    </head>
    <body>
        <style src="into/custom.css"></style>

        <div id="fb-root"></div>
        <script type="text/javascript">
            (function(d, s, id) {
                var js, fjs = d.getElementsByTagName(s)[0];
                if (d.getElementById(id)) return;
                js = d.createElement(s); js.id = id;
                js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
                fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));   
        </script>
       
        <!-- 创建导航 -->
        <!-- 创建导航 -->
        <div>
            <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
            <div class="collapse navbar-collapse">
                <ul class="nav navbar-nav">
                <li><a href="home.php" class="navbar-brand"><span class="glyphicon glyphicon-globe"></span></a></li>
                <li><a href="home.php"><span class="glyphicon glyphicon-home">主页</span></a></li>
                <li><a href="search.php"><span class="glyphicon glyphicon-search">搜索</span></a></li>
                <li class="active"><a href="#"><span class="glyphicon glyphicon-globe">论坛</span></a></li>            
                <li><a href="collection.php"><span class="glyphicon glyphicon-star-empty">收藏</span></a></li>
                <li><a href="geteml.php"><span class="glyphicon glyphicon-envelope">收信箱</span></a></li>
                <li><a href="posteml.php"><span class="glyphicon glyphicon-pencil">写信箱</span></a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-wrench">设置</span><b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li class="socials"><g:plusone annotation="inline" width="150"></g:plusone></li>
                        <li class="socials"><div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-width="The pixel width of the plugin" data-height="The pixel height of the plugin" data-colorscheme="light" data-layout="standard" data-action="like" data-show-faces="true" data-send="false"></div></li>
                        <li class="socials"><a href="settings.php" class="twitter-share-button"><span class="glyphicon glyphicon-user">个人信息设置</span></a>                          
                    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></li>
                    </ul>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="glyphicon glyphicon-user" data-toggle="dropdown">我的<b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a id="action-1" href="#">用户名:
                                <?php
                                    $userid = $_SESSION['userid'];
                                    $conn = mysqli_connect();
                                    $check_query = mysqli_query($conn,"SELECT username,account FROM users WHERE id='$userid'");
                                    $row = mysqli_fetch_array($check_query);
                                    echo $row[0].'</a></li> 
                                        <li><a href="#">帐户:'.$row[1].'</a></li> <li class="divider"></li>';
                                ?>                                                         
                        </ul>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="glyphicon glyphicon-time" data-toggle="dropdown">时针<b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a id="action-1" href="#"><?php echo date('Y-m-d h:i:s',time());?></a></li>                               
                        </ul>
                    </li>                   
                </ul>

                <ul class="nav navbar-nav navbar-right"> 
                    <li><a href="loginto.php"><span class="glyphicon glyphicon-log-in"></span> 登录</a></li> 
                    <li><a href="reginto.php"><span class="glyphicon glyphicon-user"></span> 注册</a></li> 
                </ul>
                </div>
            </nav>
        </div>
        <!---->
        
        <!-- Ajax -->
        <script>
            function getVote(int) {
                if (window.XMLHttpRequest) {
                    // IE7+, Firefox, Chrome, Opera, Safari 执行代码
                    xmlhttp=new XMLHttpRequest();
                } else {
                    // IE6, IE5 执行代码
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
                
                xmlhttp.open("GET","https://www.test.com/NB/self/Ajax/poll_vote.php?vote="+int,true);
                xmlhttp.send();
    
                xmlhttp.onreadystatechange=function() {
              
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                    document.getElementById("poll").innerHTML=xmlhttp.responseText;
                    }
                }

            }
        
            function getMVP(int) {
                if (window.XMLHttpRequest) {
                    // IE7+, Firefox, Chrome, Opera, Safari 执行代码
                    xmlhttp=new XMLHttpRequest();
                } else {
                    // IE6, IE5 执行代码
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
                
                xmlhttp.open("GET","https://www.test.com/NB/self/Ajax/poll_vote5.php?vote="+int,true);
                xmlhttp.send();
    
                xmlhttp.onreadystatechange=function() {
              
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                    document.getElementById("MVP").innerHTML=xmlhttp.responseText;
                    }
                }

            }
        
        </script>
        <!-- Ajax -->

        <br><br><br>
        <!-- 跟踪栅 -->
        <nav id="navbar-example" class="navbar navbar-default navbar-static" role="navigation">
            <div class="container-fluid"> 
            <div class="navbar-header">
                <button class="navbar-toggle" type="button" data-toggle="collapse"
                        data-target=".bs-js-navbar-scrollspy">
                    <span class="sr-only">切换导航</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">教程名称</a>
            </div>
            <div class="collapse navbar-collapse bs-js-navbar-scrollspy">
                <ul class="nav navbar-nav">
                    <li><a href="#ios">iOS</a></li>
                    <li><a href="#svn">SVN</a></li>
                    <li class="dropdown">
                        <a href="#" id="navbarDrop1" class="dropdown-toggle"
                           data-toggle="dropdown">Java
                            <b class="caret"></b>
                        </a>
                        <ul class="dropdown-menu" role="menu"
                            aria-labelledby="navbarDrop1">
                            <li><a href="#jmeter" tabindex="-1">jmeter</a></li>
                            <li><a href="#ejb" tabindex="-1">ejb</a></li>
                            <li class="divider"></li>
                            <li><a href="#spring" tabindex="-1">spring</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
            </div> 
        </nav>
        <div data-spy="scroll" data-target="#navbar-example" data-offset="0"
             style="height:200px;overflow:auto; position: relative;">
            <h4 id="ios">iOS</h4>
            <p>iOS 是一个由苹果公司开发和发布的手机操作系统。最初是于 2007 年首次发布 iPhone、iPod Touch 和 Apple
                TV。iOS 派生自 OS X,它们共享 Darwin 基础。OS X 操作系统是用在苹果电脑上,iOS 是苹果的移动版本。
            </p>
            <h4 id="svn">SVN</h4>
            <p>Apache Subversion,通常缩写为 SVN,是一款开源的版本控制系统软件。Subversion 由 CollabNet 公司在 2000 年创建。但是现在它已经发展为 Apache Software Foundation 的一个项目,因此拥有丰富的开发人员和用户社区。
            </p>
            <h4 id="jmeter">jMeter</h4>
            <p>jMeter 是一款开源的测试软件。它是 100% 纯 Java 应用程序,用于负载和性能测试。
            </p>
            <h4 id="ejb">EJB</h4>
            <p>Enterprise Java Beans(EJB)是一个创建高度可扩展性和强大企业级应用程序的开发架构,部署在兼容应用程序服务器(比如 JBOSS、Web Logic 等)的 J2EE 上。
            </p>
            <h4 id="spring">Spring</h4>
            <p>Spring 框架是一个开源的 Java 平台,为快速开发功能强大的 Java 应用程序提供了完备的基础设施支持。
            </p>
            <p>Spring 框架最初是由 Rod Johnson 编写的,在 20036 月首次发布于 Apache 2.0 许可证下。
            </p>
        </div>

        <script type="text/javascript">
            (function() {
                var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
                po.src = 'https://apis.google.com/js/plusone.js';
                var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
            })();
        </script>
        <br><br><br>
        <div id="poll">
            <h3>你期待龙星通信吗?</h3>
            <form>1.期待:
            <input type="radio" name="vote" value="21" onclick="getVote(this.value)">
            <br>2.不期待:
            <input type="radio" name="vote" value="22" onclick="getVote(this.value)">
            </form>
        </div>

        <div id="MVP">
            <h3>你给龙星通信打几星?</h3>
            <form>.1:
                <input type="radio" name="vote" value="51" onclick="getMVP(this.value)">
            <br>.2:
                <input type="radio" name="vote" value="52" onclick="getMVP(this.value)">
            <br>.3:
                <input type="radio" name="vote" value="53" onclick="getMVP(this.value)">
            <br>.4:
                <input type="radio" name="vote" value="54" onclick="getMVP(this.value)">
            <br>.5:
                <input type="radio" name="vote" value="55" onclick="getMVP(this.value)">
            </form>
        </div>

        <script type="text/javascript">
        (function() {
            var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
            po.src = 'https://apis.google.com/js/plusone.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
        })();
        </script>
        <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script> 
        <script src="bootstrap-3.0.0/dist/js/bootstrap.min.js"></script>

        <hr>
        <p align = "center">龙星通信@2020 by ToDo App.</p>
    </body>
</html>

<15>.搜索论坛(投票)后台poll_vote.php

<?php
header('Access-Control-Allow-Origin:*');
$vote = htmlspecialchars($_REQUEST['vote']);

// 获取文件中存储的数据
$filename = "poll_result.txt";
$content = file($filename);

// 将数据分割到数组中
$array = explode("||", $content[0]);
$yes = $array[0];
$no = $array[1];

if ($vote == 21)
{
  $yes = $yes + 1;
}

if ($vote == 22)
{
  $no = $no + 1;
}

// 插入投票数据
$insertvote = $yes."||".$no;
$fp = fopen($filename,"w");
fputs($fp,$insertvote);
fclose($fp);
?>
<h2>结果:</h2>
<table>
    <tr>
    <td>:</td>
    <td>
        <span style="display: inline-block; background-color:green;
        width:<?php echo(100*round($yes/($no+$yes),2)); ?>px;
        height:20px;" ></span>
        <?php echo(100*round($yes/($no+$yes),2)); ?>%
    </td>
    </tr>
    <tr>
    <td>:</td>
        <td>
            <span style="display: inline-block; background-color:red;
            width:<?php echo(100*round($no/($no+$yes),2)); ?>px;
            height:20px;"></span>
        <?php echo(100*round($no/($no+$yes),2)); ?>%
        </td>
    </tr>
</table>

@其他:

第一章:初遇

第二章:相识

第三章:相知

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/92741.html

(0)
小半的头像小半

相关推荐

极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!