大項目之網上書城（一）——註冊頁面

時間 2019-12-06

標籤項目網上書城註冊頁面简体版

原文原文鏈接

大項目之網上書城（一）——註冊頁面

1.head頁面

代碼

先寫一個通用的head頁面。css

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<title>Insert title here</title>
<!-- 這裏的href請寫本身的bootstrap的css的連接。若是沒有下載，能夠用這個 -->
<!-- https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css -->
<link rel="stylesheet" href="${pageContext.request.contextPath }/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<!-- 其實只用到了裏面的一個購物車的小圖標啦 -->
<style type="text/css">
/*這個字體我在這裏估計是放不出來了。你們有興趣的話能夠找找看其餘好看的字體。*/
@font-face{
  font-family: myFont;
  src: url("../bootstrap-3.3.7-dist/fonts/Adventure-Normal.ttf");
}
a:link {text-decoration:none;color: black} /* 未訪問的連接 */
a:visited {text-decoration:none;color: black} /* 已訪問的連接 */
a:hover {text-decoration:none;color: #068} /* 鼠標移動到連接上 */
a:active {text-decoration:none;color: #068} /* 選定的連接，即鼠標按下去的時候不鬆開顯示的狀態 */
a{
    font-size:18px;
}
</style>
</head>
<body>
<!-- 頭部佔了100px高。而後大概把頭部用div分爲了2個部分，左右各預留了15%寬的留白，左邊是一個Bookstrap的文本，右邊是導航欄。 -->
<div style="height:100px;width:100%;float:left">
    <!-- BookStore字樣 -->
    <div style="line-height:120px;height:100px;width:45%;margin-left:15%;float:left">
        <font face="myFont" color = "black" style="font-size:60px">BookStore</font>
    </div>
    <!-- 導航欄 -->
    <div style="height:100px;width:25%;float:left;margin-right:15%">
        <div style="height:100px;width:25%;float:left;padding-top:40px">
            <a href="#"><span class="glyphicon glyphicon-shopping-cart"></span>購物車</a>
        </div>
        <div style="height:100px;width:25%;float:left;padding-top:40px">
        <a href="#">幫助中心</a>
        </div>
        <div style="height:100px;width:25%;float:left;padding-top:40px">
        <a href="#">個人帳戶</a>
        </div>
        <div style="height:100px;width:25%;float:left;padding-top:40px">
        <a href="#">用戶註冊</a>
        </div>
    </div>
</div>
</body>
</html>

效果展現

2.foot頁面

代碼

再寫一個通用的foot頁面html

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<title>Insert title here</title>
<style type="text/css">
a:link {text-decoration:none;color: black} /* 未訪問的連接 */
a:visited {text-decoration:none;color: black} /* 已訪問的連接 */
a:hover {text-decoration:none;color: #068} /* 鼠標移動到連接上 */
a:active {text-decoration:none;color: #068} /* 選定的連接，即鼠標按下去的時候不鬆開顯示的狀態 */
</style>
</head>
<body>
<div style="width:100%;height:60px;float:left">
    <div style="width:100%;height:15px;float:left;margin-top:10px;text-align:center">
        <a href="#" style="font-size:14px">關於書城</a>&nbsp;&nbsp;
        <a href="#" style="font-size:14px">About&nbsp;BookStore</a>&nbsp;&nbsp;
        <a href="#" style="font-size:14px">書城推廣</a>&nbsp;&nbsp;
        <a href="#" style="font-size:14px">意見反饋</a>
    </div>
    <div style="width:100%;height:15px;float:left;margin-top:12px;text-align:center">
        <font style="color:#233;font-size:14px">©2019&nbsp;BookStore&nbsp;&nbsp;</font>
        <font style="color:#233;font-size:14px">京ICP證xxxxxx號</font>&nbsp;&nbsp;&nbsp;
        <font style="color:#233;font-size:14px">京公網安備xxxxxxxxxxxxxx號 </font>
    </div>
</div>
</body>
</html>

效果展現

3.empty頁面

代碼

用一個empty頁面將head和foot整合起來，順便中間留空，方便以後添加其餘代碼。java

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<title>空白</title>
</head>
<body style="background-color:#bbb">
<!-- 調用頭部頁面 -->
<div style="width:100%;height:100px;float:left">
<jsp:include page="head.jsp"></jsp:include>
</div>
<!-- 通用內容體大小 -->
<div style="width:100%;height:720px;float:left">

</div>
<!-- 調用底部頁面 -->
<div style="width:100%;height:60px;float:left">
<jsp:include page="foot.jsp"></jsp:include>
</div>
</body>
</html>

效果展現

4.register頁面

代碼

最終修改後獲得註冊頁面~jquery

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<title>註冊</title>
<!-- 這裏的href請寫本身的bootstrap的css的連接。若是沒有下載，能夠用這個 -->
<!-- https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css -->
<link rel="stylesheet" href="${pageContext.request.contextPath }/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<!-- jquery和bootstrap的連接能夠用下面的 -->
<!-- https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js -->
<!-- https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js -->
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-3.3.1/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!-- register.js是我本身寫的，裏面放了判斷輸入是否合理，以及驗證碼的正確與否的。以後放上了。 -->
<script type="text/javascript" src="${pageContext.request.contextPath}/client/js/register.js"></script>
</head>
<body style="background-color:#bbb">
<!-- 調用頭部頁面 -->
<div style="width:100%;height:100px;float:left">
<jsp:include page="head.jsp"></jsp:include>
</div>
<!-- 通用內容體大小 -->
<div style="width:70%;height:720px;float:left;margin-left:15%;">
    <!-- 好看的圖 -->
    <div style="width:55%;height:100%;float:left;margin-top:5%;">
        <img alt="拿書女孩" src="img/girl.jpg" style="width:90%;">
    </div>
    <!-- 註冊界面 -->
    <div style="width:45%;height:80%;float:left;margin-top:7%">
        <form action="#" method="post" class="form-horizontal" role="form">
            <!-- form表單的每一項都由bootstrap展現效果。 -->
            <div class="form-group">
                <!-- 名稱佔3個長度col-sm-3，加大化input-lg -->
                <label for="firstname" class="col-sm-3 control-label input-lg">郵箱</label>
                <!-- 輸入框和提示一共佔9個長度col-sm-9，輸入框加大化input-lg，提示使用不一樣顏色的列表（可用警告代替，二者很類似。） -->
                <div class="col-sm-9">
                    <input type="text" name="email" id="email" class="form-control input-lg"
                           placeholder="請輸入郵箱" style="width:45%;float:left"/>
                    <ul class="list-group">
                      <li class="list-group-item list-group-item-info" style="float:left;" id="text1">請輸入有效的郵箱地址</li>
                      <li class="list-group-item list-group-item-danger" style="float:left;display:none" id="emailMsg"></li>
                    </ul>
                </div>
            </div>
            <!-- 如下如法炮製 -->
            <div class="form-group">
                <label for="lastname" class="col-sm-3 control-label input-lg">暱稱</label>
                <div class="col-sm-9">
                    <input type="text" name="username" id="username" class="form-control input-lg"
                           placeholder="請輸入暱稱" style="width:45%;float:left"/>
                    <ul class="list-group">
                      <li class="list-group-item list-group-item-info" style="float:left;" id="text2">暱稱請設置4~20位字符</li>
                      <li class="list-group-item list-group-item-danger" style="float:left;display:none" id="usernameMsg"></li>
                    </ul>
                </div>
            </div>
            <div class="form-group">
                <label for="firstname" class="col-sm-3 control-label input-lg">密碼</label>
                <div class="col-sm-9">
                    <input type="password" name="password" id="password" 
                    class="form-control input-lg" placeholder="請輸入密碼" style="width:45%;float:left"/>
                    <ul class="list-group">
                      <li class="list-group-item list-group-item-info" style="float:left;" id="text3">密碼請設置4~20位字符</li>
                      <li class="list-group-item list-group-item-danger" style="float:left;display:none" id="passwordMsg"></li>
                    </ul>
                </div>
            </div>
            <div class="form-group">
                <label for="lastname" class="col-sm-3 control-label input-lg">確認密碼</label>
                <div class="col-sm-9">
                    <input type="password" name="repassword" id="repassword"
                    class="form-control input-lg" placeholder="請再次輸入密碼" style="width:45%;float:left"/>
                    <ul class="list-group">
                      <li class="list-group-item list-group-item-danger" style="float:left;display:none" id="confirmMsg"></li>
                    </ul>
                </div>
            </div>
            <div class="form-group">
                <label for="firstname" class="col-sm-3 control-label input-lg">手機號</label>
                <div class="col-sm-9">
                    <input type="text" name="telephone" 
                    class="form-control input-lg" placeholder="請輸入手機號" style="width:45%;float:left"/>
                </div>
            </div>
            <div class="form-group">
                <label for="firstname" class="col-sm-3 control-label input-lg">性別</label>
                <div class="col-sm-9">
                    <label class="radio-inline input-lg">
                        <input type="radio" name="gender" value="男" checked="checked"/>男 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    </label>
                    <label class="radio-inline input-lg">
                        <input type="radio" name="gender" value="女"/>女
                    </label>
                </div>
            </div>
            <div class="form-group">
                <label for="firstname" class="col-sm-3 control-label input-lg">驗證碼</label>
                <div class="col-sm-9">
                    <input type="text" id="code"
                    class="form-control input-lg" placeholder="請輸入驗證碼" style="width:45%;float:left"/>
                    <img src="${pageContext.request.contextPath}/imageCode"
                    width="180"height="30"class="textinput"
                    style="height:42px;"id="img"/>
                    <a href="javascript:void(0);"id="a1" >換一張</a>
                </div>
            </div>
            <br/>
            <div class="form-group">
                <label for="firstname" class="col-sm-1 control-label input-lg"></label>
                <div class="col-sm-5">
                    <input type="submit" name="submit" value="提交"
                    class="form-control input-lg btn btn-primary"style="width:100%;float:left"/>
                </div>
                <div class="col-sm-5">
                    <input type="reset" name="reset" value="重置" id="re"
                    class="form-control input-lg btn btn-warning"style="width:100%;float:left"/>
                </div>
            </div>
        </form>
    </div>
</div>
<!-- 調用底部頁面 -->
<div style="width:100%;height:60px;float:left">
<jsp:include page="foot.jsp"></jsp:include>
</div>
</body>
</html>

效果展現

5.register.js

代碼

function checkEmail() {         // 驗證郵箱
    var regex = /^[\w-]+@([\w-]+\.)+[a-zA-Z]{2,4}$/;
    var value =$("#email").val();
    var msg = "";
    if (!value)
        msg = "郵箱必須填寫：";
    else if (!regex.test(value))
        msg = "郵箱格式不合法：";
    $("#emailMsg").html(msg);
    $("#emailMsg").css("display","block");
    $("#text1").css("display","none");
    if(msg==""){
        $("#emailMsg").removeClass("list-group-item-danger");
        var obj = document.getElementById("emailMsg");
        obj.className += " list-group-item-success";
        $("#emailMsg").html("經過！");
    }
    return msg == "";
}

function checkUsername() {      // 驗證用戶名
    var regex = /^[a-zA-Z_]\w{4,20}$/;  // 字母數字下劃線1到10位, 不能是數字開頭
    var value = $("#username").val();// 獲取usernameObj中的文本
    var msg = "";                       // 最後的提示消息, 默認爲空
    if (!value)                         // 若是用戶名沒填, 填了就是一個字符串能夠看成true, 沒填的話不論null或者""都是false
        msg = "用戶名必須填寫：";           // 改變提示消息
    else if (!regex.test(value))        // 若是用戶名不能匹配正則表達式規則
        msg = "用戶名不合法：";            // 改變提示消息
    $("#usernameMsg").html(msg);        // 將提示消息放入SPAN
    $("#usernameMsg").css("display","block");//讓文字顯示出來。
    $("#text2").css("display","none");
    if(msg==""){
        $("#usernameMsg").removeClass("list-group-item-danger");
        var obj = document.getElementById("usernameMsg");
        obj.className += " list-group-item-success";
        $("#usernameMsg").html("經過！");
    }
    return msg == "";                   // 若是提示消息爲空則表明沒出錯, 返回true
}

function checkPassword() {      // 驗證密碼
    var regex = /^.{4,20}$/;            // 任意字符, 6到16位
    var value =$("#password").val();
    var msg = "";
    if (!value)
        msg = "密碼必須填寫：";
    else if (!regex.test(value))
        msg = "密碼不合法：";
    $("#passwordMsg").html(msg);
    $("#passwordMsg").css("display","block");//讓文字顯示出來。
    $("#text3").css("display","none");
    if(msg==""){
        $("#passwordMsg").removeClass("list-group-item-danger");
        var obj = document.getElementById("passwordMsg");
        obj.className += " list-group-item-success";
        $("#passwordMsg").html("經過！");
    }
    return msg == "";
}

function checkConfirm() {       // 驗證確認密碼
    var passwordValue = $("#password").val();
    var confirmValue = $("#repassword").val();
    var msg = "";

    if(!confirmValue){
        msg = "確認密碼必須填寫";
    }
    else    if (passwordValue != confirmValue){
        msg = "密碼必須保持一致";
    }
    $("#confirmMsg").html(msg);
    $("#confirmMsg").css("display","block");//讓文字顯示出來。
    if(msg==""){
        $("#confirmMsg").removeClass("list-group-item-danger");
        var obj = document.getElementById("confirmMsg");
        obj.className += " list-group-item-success";
        $("#confirmMsg").html("經過！");
    }
    return msg == "";
}
$(function(){
    var code;
    //注意
    //注意
    //這裏須要注意，由於我以前的全部jsp頁面都是在WebContent下新建的client目錄下的，因此訪問servlet的時候要加../若是大家不是這樣的話，把../去掉才能生效。
    $.post("../CheckCode",function(data){
        code=data;
    });
    $("#a1").click(function(){
        $("#img").attr("src","../imageCode?time="+new Date().getTime());
    });
    //因此我好像還要把imageCode和CheckCode這兩個servlet放上來~
    //注意
    //注意
    //注意
    $("#re").click(function(){
        $("#text1").css("display","block");
        $("#text2").css("display","block");
        $("#text3").css("display","block");
        $("#emailMsg").css("display","none");
        $("#usernameMsg").css("display","none");
        $("#passwordMsg").css("display","none");
        $("#confirmMsg").css("display","none");
    });
    $("#email").keyup(function(){
        checkEmail();
    });
    $("#username").keyup(function(){
        checkUsername();
    });
    $("#password").keyup(function(){
        checkPassword();
    });
    $("#repassword").keyup(function(){
        checkConfirm();
    });
    $("form").submit(function(){
        $.post("../CheckCode",function(data){
            code=data;
        if(code==$("#code").val()){
            return checkEmail()&&checkUsername()&&checkPassword()&&checkConfirm();
        }
        else{
            alert("驗證碼錯誤！");
            return false;
        }
        });
    });
});

6.imageCode：生成驗證碼

代碼

package cn.edu.bdu.mc.utils;

import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.io.BufferedReader;
import java.io.FileInputStream;
import java.io.IOException;
import java.io.InputStreamReader;
import java.util.ArrayList;
import java.util.List;
import java.util.Random;

import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * 生成驗證碼的工具類
 */
@SuppressWarnings("serial")
@WebServlet("/imageCode")
public class CheckImageServlet extends HttpServlet {

    // 集合中保存全部成語
    private List<String> words = new ArrayList<String>();

    @Override
    public void init() throws ServletException {
        // 初始化階段，讀取new_words.txt
        // web工程中讀取 文件，必須使用絕對磁盤路徑
         // 成語一下子也發上來。。
        String path = getServletContext().getRealPath("/WEB-INF/new_words.txt");
        try {
            BufferedReader reader = new BufferedReader(new InputStreamReader(
                    new FileInputStream(path), "utf-8"));
            String line;
            while ((line = reader.readLine()) != null) {
                words.add(line);
            }
            reader.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 禁止緩存
        // response.setHeader("Cache-Control", "no-cache");
        // response.setHeader("Pragma", "no-cache");
        // response.setDateHeader("Expires", -1);

        int width = 180;
        int height = 30;

        // 步驟一 繪製一張內存中圖片
        BufferedImage bufferedImage = new BufferedImage(width, height,
                BufferedImage.TYPE_INT_RGB);

        // 步驟二 圖片繪製背景顏色 ---經過繪圖對象
        Graphics graphics = bufferedImage.getGraphics();// 獲得畫圖對象 --- 畫筆
        // 繪製任何圖形以前 都必須指定一個顏色
        graphics.setColor(getRandColor(200, 250));
        graphics.fillRect(0, 0, width, height);

        // 步驟三 繪製邊框
        graphics.setColor(Color.WHITE);
        graphics.drawRect(0, 0, width - 1, height - 1);

        // 步驟四 四個隨機數字
        Graphics2D graphics2d = (Graphics2D) graphics;
        // 設置輸出字體
        graphics2d.setFont(new Font("宋體", Font.BOLD, 18));

        Random random = new Random();// 生成隨機數
        int index = random.nextInt(words.size());
        String word = words.get(index-1);// 得到成語
        // 定義x座標
        int x = 10;
        for (int i = 0; i < word.length(); i++) {
            // 隨機顏色
            graphics2d.setColor(new Color(20 + random.nextInt(110), 20 + random
                    .nextInt(110), 20 + random.nextInt(110)));
            // 旋轉 -30 --- 30度
            int jiaodu = random.nextInt(60) - 30;
            // 換算弧度
            double theta = jiaodu * Math.PI / 180;

            // 得到字母數字
            char c = word.charAt(i);

            // 將c 輸出到圖片
            graphics2d.rotate(theta, x, 20);
            graphics2d.drawString(String.valueOf(c), x, 20);
            graphics2d.rotate(-theta, x, 20);
            x += 40;
        }

        // 將驗證碼內容保存session
        request.getSession().setAttribute("checkcode_session", word);
        // 步驟五 繪製干擾線
        graphics.setColor(getRandColor(160, 200));
        int x1;
        int x2;
        int y1;
        int y2;
        for (int i = 0; i < 30; i++) {
            x1 = random.nextInt(width);
            x2 = random.nextInt(12);
            y1 = random.nextInt(height);
            y2 = random.nextInt(12);
            graphics.drawLine(x1, y1, x1 + x2, x2 + y2);
        }

        // 將上面圖片輸出到瀏覽器 ImageIO
        graphics.dispose();// 釋放資源
        ImageIO.write(bufferedImage, "jpg", response.getOutputStream());

    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doGet(request, response);
    }

    /**
     * 取其某一範圍的color
     * 
     * @param fc
     *            int 範圍參數1
     * @param bc
     *            int 範圍參數2
     * @return Color
     */
    private Color getRandColor(int fc, int bc) {
        // 取其隨機顏色
        Random random = new Random();
        if (fc > 255) {
            fc = 255;
        }
        if (bc > 255) {
            bc = 255;
        }
        int r = fc + random.nextInt(bc - fc);
        int g = fc + random.nextInt(bc - fc);
        int b = fc + random.nextInt(bc - fc);
        return new Color(r, g, b);
    }

}

7.CheckCode：校驗驗證碼

代碼

package cn.edu.bdu.mc.servlets;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@SuppressWarnings("serial")
@WebServlet("/CheckCode")
public class CheckCodeServlet extends HttpServlet {
    
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        response.setContentType("text/html;charset=utf-8");
        response.getWriter().print(request.getSession().getAttribute("checkcode_session"));
        
    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        doGet(request, response);
    }

}

8.new_words.txt

五顏六色
歡聲雷動
欣喜若狂
載歌載舞
燈火輝煌
春暖花開
春色滿園
春光明媚
春意盎然
春回大地
興致勃勃
精衛填海
愚公移山
百折不回
一往無前
骨肉之情
痛癢相關
人山人海
情深似海
恩重如山
按部就班
由淺入深
日積月累
溫故知新
漫山遍野
綠葉成陰
天長地久
樹大根深
自由自在
人無遠慮
必有近憂
防患未然
有備無患
不由自主
自言自語
臨危不懼
多謀善斷
從容不迫
方寸不亂
金風送爽
雁過留聲
秋色宜人
天朗氣清
日月如梭
光陰似箭
寒來暑往
星移物換
風吹草動
雨過天晴
順理成章
水到渠成
人外有人
天外有天
學無止境
勇往直前
滴水成冰
地凍天寒
鵝毛大雪
雪兆豐年
勤能補拙
笨鳥先飛
人一已百
奮起直追
寧折不彎
義正辭嚴
威武不屈
大義凜然
火樹銀花
數不勝數
燈火通明
觀者如堵
一望無邊
不知不覺
雪窖冰天
勤學苦練
無家可歸
千山萬水
千辛萬苦
成羣結隊
無憂無慮
引吭高歌
綿亙不絕
滿面紅光
張燈結綵
歡聚一堂
普天同慶
喜氣洋洋
百花怒放
爭奇鬥豔
五彩繽紛
色色俱全
得意洋洋
天長日久
狐假虎威
半信半疑
神氣活現
搖頭擺尾
東張西望
大搖大擺
跋山涉水
餐風飲露
水送山迎
賞心悅目
生機勃勃
心狠手辣
起早貪黑
神通廣大
高聳入雲
日思夜想
重見天日
舐犢之愛
烏鳥私情
天倫之樂
其樂無窮
摩拳擦掌
生龍活虎
身強力壯
銅筋鐵骨
專心致志
聚精會神
迫不得已
一本正經
千家萬戶
莘莘學子
立雪求道
春風化雨
孺子可教
昏頭昏腦
密密麻麻
舉世聞名
金光燦燦
色彩斑斕
五光十色
翩翩起舞
感人肺腑
可歌可泣
堅苦卓絕
驚天動地
南來北往
披星戴月
流星趕月
衆星捧月
烘雲托月
驚濤拍岸
意味深長
根深固本
澆樹澆根
根深葉茂
葉落歸根
一碧如洗
熱鬧非凡
層層疊疊
心曠神怡
高堂廣廈
玉宇瓊樓
錯落有致
曲徑通幽
千巖競秀
萬壑爭流
應接不暇
美不勝收
生根長葉
競相開放
胡做非爲
興風做浪
雛鷹展翅
老馬識途
魚貫而入
傾巢而出
雞飛狗跳
狼奔豕突
羣龍無首
狡兔三窟
萬般無奈
轉弱爲強
忍辱負重
以屈求伸
發奮圖強
救亡圖存
臥薪嚐膽
催人奮進
羽翼豐滿
報仇雪恨
聞名中外
人流如潮
馳名中外
紅白相間
大街小巷
人頭攢動
風馳電掣
車水馬龍
華燈初上
流光溢彩
美輪美奐
巧奪天工
氣勢洶洶
不禁分說
蠻不講理
蜂擁而上
無影無蹤
乾乾淨淨
和風細雨
呼風喚雨
櫛風沐雨
未風先雨
見風是雨
葉公好龍
悽風苦雨
狂風暴雨
漸漸平息
經久不息
蜂擁而至
一無所得
埋頭苦幹
傾盆大雨
戎馬一輩子
身經百戰
刮骨療毒
傳爲美談
約法三章
秋毫無犯
指揮若定
好謀善斷
天各一方
一年一度
學海無涯
書山有路
九牛一毛
滄海一粟
孜孜以求
盡心盡力
百尺竿頭
更進一步
水天相連
星羅棋佈
變幻無常
騰雲駕霧
千姿百態
雲遮霧罩
瞬息萬變
一瀉千里
四蹄生風
黔驢技窮
流連忘返
氣象萬千
風雲變幻
奇峯異嶺
若隱若現
飄飄欲仙
白雲蒼狗
恍然大悟
不覺得然
有利可圖
有隙可乘
有根有底
善始善終
有口難言
有恃無恐
有求必應
有志竟成
平平展展
全力以赴
神勇無比
運足氣力
成竹在胸
文思如泉
風華正茂
出類拔萃
才思敏捷
後生可畏
手不停揮
筆下生花
力透紙背
精妙絕倫
爐火純青
活靈活現
栩栩如生
夢筆生花
渾然天成
斗酒百篇
鬼哭神驚
喜出望外
談笑風生
沙漠之舟
自強不息
忍辱負重
始終如一
飛沙走石
志在千里
義無反顧
堅決不移
七嘴八舌
成千上萬
坐觀成敗
按兵不動
操之過急
輕舉妄動
興風做浪
蠢蠢欲動
雷厲風行
聞風而動
展翅高飛
望而生畏
竊竊私語
煙波浩渺
一碧萬頃
遊人如織
一路順風
風平浪靜
鷗水相依
海波不驚
揠苗滋長
鄭人買履
振振有詞
爭論不休
充滿信心
杯弓蛇影
螳螂捕蟬
鷸蚌相爭
歡天喜地
古今中外
不由自主
心緒不寧
各奔東西
悲歡離合
手足情深
蓬蓬勃勃
層次分明
羊腸小道
文思敏捷
聰明過人
青出於藍
一舉成名
桃李爭妍
後繼有人
十年樹木
百年樹人
遙遙相對
笑語盈盈
雄偉壯麗
格外挺拔
一覽無餘
雕樑畫棟
永垂不朽
花團錦簇
奼紫嫣紅
風雨不透
以身許國
碧血丹心
年復一年
疾惡如仇
敢怒敢言
憂國憂民
橫眉冷對
浩氣長存
大義滅親
若無其事
蔚爲壯觀
詩情畫意
雪峯插雲
古木參天
平湖飛瀑
異獸珍禽
極目遠眺
遼闊無垠
默默無聞
怡然自得
湖光山色
人間天堂
明月清風
桂子飄香
水光接天
相得益彰
江山如畫
魚米之鄉
開天闢地
精疲力竭
縱橫交錯
當心翼翼
大發雷霆
不遠萬里
懸崖絕壁
日復一日
混沌不分
昏天黑地
大刀闊斧
與日俱增
頂天立地
變化萬端
改天換地
遠渡重洋
名列前茅
倒背如流
絕不氣餒
有所做爲
終年累月
斷垣殘壁
如有所悟
乘風破浪
渾身無力
不知不覺
起死回生
息息相關
豐富多彩
遠在天涯
近在咫尺
天南地北
萬水千山
無所不有
足不出戶
學富五車
學貫中西
博古通今
功成名就
著做等身
文質彬彬
溫文爾雅
情不自禁
浩浩蕩蕩
濫殺無辜
恩將仇報
千恩萬謝
見利忘義
背信棄義
肝膽相照
開誠相見
同舟共濟
心領神會
志同道合
榮辱與共
脣亡齒寒
親密無間
潔白晶瑩
瓊枝玉樹
千姿百態
欣欣向榮
萬紫千紅
開卷有益
抑揚頓挫
春滿人間
千帆競發
萬馬奔騰
六畜興旺
五穀豐登
國泰民安
人壽年豐
歡聲笑語
綠色工廠
春深似海
風月無邊
世外桃源
山外有山
飛瀑流泉
古木參天
詩情畫意
蔚爲壯觀
循規蹈矩
不爲人知
漫山遍野
微不足道
機毀人亡
垂手可得
淺嘗輒止
囫圇吞棗
浮光掠影
不甚了了
天道酬勤
熟能生巧
尋根問底
無所不曉
三顧茅廬
蜿蜒起伏
青翠欲滴
秀麗宜人
羣雄紛爭
茅塞頓開
一唱一和
一呼百應
一乾二淨
一箭雙鵰
一落千丈
如出一轍
一暴十寒
一日千里
一五一十
一心一意
兩面三刀
三長兩短
三番五次
三三兩兩
三頭六臂
三心二意
三言兩語
四分五裂
四面八方
四通八達
四平八穩
五顏六色
五湖四海
五花八門
五光十色
魂飛魄散
七顛八倒
七零八落
七拼八湊
七上八下
七手八腳
七嘴八舌
八面玲瓏
九死一輩子
十全十美
百發百中
百孔千瘡
百戰百勝
百依百順
變幻無窮
千差萬別
千軍萬馬
千山萬水
千絲萬縷
千辛萬苦
千言萬語
千真萬確
千錘百煉
想方設法
千奇百怪
千姿百態
危在旦夕
千慮一得
千慮一失
千篇一概
萬水千山
萬無一失
萬衆一心
萬紫千紅
萬死一輩子
推心置腹
肝膽相照
情同手足
志同道合
風雨同舟
榮辱與共
患難與共
關懷備註
心心相印
海誓山盟
拔刀相助
親密無間
萬紫千紅
春暖花開
鳥語花香
奼紫嫣紅
花紅柳綠
百花爭豔
錦上添花
火樹銀花
昨日黃花
春花秋月
過期黃花
花團錦簇
花枝招展
崇山峻嶺
山明水秀
山窮水盡
大好山河
刀山火海
地動山搖
高山深澗
懸崖峭壁
峯巒雄偉
漫山遍野
江山如畫
錦繡山河
五彩繽紛
五光十色
一碧千里
萬紫千紅
花紅柳綠
翠色慾流
奼紫嫣紅
五顏六色
青紅皁白
綠水青山
不可多得
百裏挑一
九牛一毛
絕無僅有
曠古絕倫
寥寥無幾
寥若晨星
寧缺毋濫
史無前例
屈指可數
三三兩兩
鐵樹開花
微乎其微
一麟半爪
一絲一毫
鳳毛麟角
滄海一粟
千古絕唱
摩肩接踵
車水馬龍
川流不息
紛至沓來
花花世界
舉袖爲雲
揮汗如雨
絡繹不絕
門庭若市
萬人空巷
風雨不透
人聲鼎沸
人歡馬叫
人山人海
震耳欲聾
座無虛席
一應俱全
琳琅滿目
美不勝收
應接不暇
無奇不有
無窮無盡
無所不包
五花八門
眼花繚亂
洋洋大觀
包羅萬象
應有盡有
目不暇接
比比皆是
不可計數
層出不窮
綽綽有餘
多多益善
多如牛毛
俯拾皆市
舉不勝舉
漫山遍野
星羅棋佈
豐富多彩
九霄雲外
騰雲駕霧
壯志凌雲
風雲變幻
風起雲涌
行雲流水
風捲殘雲
浮雲蔽日
孤雲野鶴
烘雲托月
過眼雲煙
煙消雲散
大雨傾盆
血雨腥風
風雨交加
風調雨順
槍林彈雨
風雨同舟
風雨無阻
和風細雨
暴風驟雨
滿城風雨
滂沱大雨
春風化雨
搖搖欲墜
斜風細雨
未雨綢繆
水流湍急
水平如鏡
高山流水
千山萬水
水滴石穿
水乳交融
滴水不漏
杯水車薪
洪水猛獸
流水無情
直言不諱
無所顧忌
拐彎抹角
真心誠意
故弄玄虛
侃侃而談
口若懸河
虛情假意
推心置腹
旁敲側擊
喋喋不休
慢條斯理
含糊其詞
嘮嘮叨叨
振振有辭
肆無忌憚
大言不慚
娓娓動聽
繪聲繪色
對答如流
自圓其說
閒言碎語
閉月羞花
沉魚落雁
出水芙蓉
明眸皓齒
美如冠玉
傾國傾城
國色天香
鶴髮童顏
眉清目秀
和善可親
心慈面善
張牙舞爪
愁眉苦臉
冰清玉潔
雍容華貴
溫文爾雅
威風凜凜
老態龍鍾
虎背熊腰
如花似玉
容光煥發
落落大方
骨瘦如柴
大腹便便
面黃肌瘦
其貌不揚
蓬頭垢面
弱不由風
滔滔不絕
對答如流
口若懸河
談笑風生
高談闊論
豪言壯語
誇誇其談
花言巧語
忐忑不安
心驚肉跳
心猿意馬
心神不定
心慌意亂
七上八下
心急如焚
班門弄斧
孤芳自賞
居功自傲
目中無人
妄自尊大
得意忘形
唯我獨尊
自高自大
自鳴得意
自我陶醉
自命不凡
目空一切
不驕不躁
功成不居
戒驕戒躁
洗耳恭聽
虛懷若谷
慎言謹行
學無止境
學而不厭
真才實學
學而不倦
發奮圖強
廢寢忘食
爭分奪秒
孜孜不倦
笨鳥先飛
聞雞起舞
自強不息
只爭朝夕
不甘示弱
盡心盡力
力爭上游
披荊斬棘
奮不顧身
捨己爲人
堅強不屈
赤膽忠心
不屈不撓
忠貞不渝
誓死不二
威武不屈
捨死忘生
肝膽相照
克己奉公
一絲不苟
兩袖清風
見禮忘義
永垂不朽
頂天立地
豁達大度
兢兢業業
賣國求榮
恬不知恥
貪生怕死
厚顏無恥
神采奕奕
眉飛色舞
昂首挺胸
惶恐不安
漫不經心
垂頭喪氣
沒精打采
愁眉苦臉
大驚失色
炯炯有神
怒髮衝冠
一目十行
一日千里
一字千金
百發百中
一日三秋
不毛之地
不可勝數
膽大包天
步履維艱
一步登天
危在旦夕
觀者如雲
揮金如土
鐵證如山
一毛不拔
穩如泰山
門庭若市
骨瘦如柴
冷若冰霜
如雷貫耳
守口如瓶
浩如煙海
高手如林
陽春三月
春光明媚
春回大地
春暖花開
春意盎然
春意正濃
風和日麗
春花爛漫
鳥語花香
百鳥鳴春
百花齊放
鶯歌燕舞
赤日炎炎
烈日炎炎
驕陽似火
揮汗如雨
大汗淋漓
鳥語蟬鳴
萬木蔥蘢
枝繁葉茂
蓮葉滿池
秋高氣爽
天高雲淡
秋風送爽
秋菊盛開
秋菊傲骨
秋色迷人
秋色宜人
金桂飄香
果實累累
北雁南飛
滿山紅葉
五穀豐登
蘆花飄揚
天寒地凍
北風呼嘯
滴水成冰
寒冬臘月
瑞雪紛飛
冰天雪地
冰封雪蓋
漫天飛雪
白雪皚皚
冰封大地
冰天雪地
東方欲曉
旭日東昇
萬物初醒
空氣清醒
雄雞報曉
晨霧瀰漫
晨光絢麗
烈日當頭
麗日臨空
豔陽高照
萬里無雲
碧空如洗
日落西山
夕陽西斜
殘陽如血
炊煙四起
百鳥歸林
華燈初上
夜幕低垂
日薄西山
夜深人靜
月明星稀
夜色柔美
夜色迷人
深更半夜
漫漫長夜
風光秀麗
人山人海
車水馬龍
寧靜和諧
草木蒼翠
竹籬瓦舍
山幽路闢
小橋流水
直指青雲
古色古香
青磚素瓦
聳入碧雲
機器轟鳴
鐵流直瀉
熱氣騰騰
鋼花飛濺
粉飾一新
門可羅雀
冷冷清清
錯落有致
富麗堂皇
設施齊全
氣勢雄偉
金碧輝煌
風景如畫
聞名遐邇
井井有理
雜亂無章
佈局巧妙
錯落有致
寬闊平坦
崎嶇不平
擁擠不堪
暢通無阻
花紅柳綠
花色迷人
花香醉人
花枝招展
百花齊放
百花怒放
百花爭豔
絢麗多彩
五彩繽紛
奼紫嫣紅
綠草如茵
一碧千里
雜草叢生
生機勃勃
蒼翠挺拔
鬱鬱蔥蔥
枯木逢春
秀麗多姿
青翠欲滴
林海雪原
聳入雲天
瓜果蔬菜
清香鮮嫩
青翠欲滴
果園飄香
果實累累
果實飽滿
鮮嫩水靈
象徵和平
乳燕初飛
婉轉悅耳
鶯歌燕舞
翩然歸來
枝頭嬉戲
灰不溜秋
嘰嘰喳喳
鸚鵡學舌
婉轉悅耳
笨嘴學舌
利嘴如鐵
鋼爪如釘
神氣活現
昂首挺胸
肥大豐滿
自由自在
引吭高歌
騰空而起
狂奔飛馳
膘肥體壯
昂首嘶鳴
瘦骨嶙峋
行動遲緩
俯首帖耳
膘肥體壯
川流不息
呼嘯而過
穿梭往來
緩緩駛離
一葉扁舟
揚帆遠航
乘風破浪
霧海夜航
追波逐浪
劃破雲層
直衝雲霄
穿雲而過
銀鷹展翅
學習用品
美觀實用
小巧玲瓏
造型優美
設計獨特
栩栩如生
活潑可愛
惹人喜好
愛不釋手
雨後彩虹
彩橋橫空
若隱若現
光芒萬丈
大雪紛飛
大雪封山
鵝毛大雪
漫天飛雪
瑞雪紛飛
林海雪原
風雪交加
雪上加霜
寒霜襲人
霜林盡染
垂露欲滴
朝露晶瑩
日出露幹
電光石火
雷電大做
驚天動地
春雷滾滾
電劈石擊
雷電交加
陰雨連綿
牛毛細雨
秋雨連綿
隨風飄灑
傾盆大雨
暴風驟雨
大雨滂沱
瓢潑大雨
大雨淋漓
暴雨如注
秋風送爽
金風送爽
北風呼嘯
微風習習
寒風刺骨
風和日麗
大霧迷途
雲霧茫茫
霧似輕紗
風吹霧散
雲消霧散
彩雲滿天
天高雲淡
烏雲翻滾
彤雲密佈
彩霞繽紛
晚霞如火
朝霞燦爛
丹霞似錦
滿天星斗
衆星捧月
羣星燦爛
萬點繁星
月出東牆
月出東山
玉兔東昇
月光皎潔
月色迷人
月牙初升
旭日東昇
日上三竿
一輪紅日
日高三尺
豔陽高照
烈日當頭
驕陽似火
日影西斜
苦口婆心
滔滔不絕
心平氣和
鎮定自若
語重心長
熱情洋溢
恭恭敬敬
洗耳恭聽
親密無間
如影隨行
情同手足
團結友愛
朝夕相處
人山人海
人聲喧譁
人聲嘈雜
人如潮涌
摩肩接踵
傾盆大雨
暴風驟雨
大雨滂沱
瓢潑大雨
讀書學習
神情專一
學而不厭
學無止境
專心致志
日積月累
似懂非懂
普天同慶
彩旗飛舞
歡天喜地
張燈結綵
徹夜狂歡
興高采烈
手舞足蹈
笨手笨腳
擠眉弄眼

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。