20150401 作业2 结对四则运算ver 1.0

Web項目下 Tomcat服務器的路徑 /WebContant/ 目錄下
SE2_2.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html class="no-js">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge; charset=UTF-8">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="viewport"
    content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" type="image/png"
    href="https://lh6.googleusercontent.com/-xtIe5pwl_0Y/VQk1jMCNZZI/AAAAAAAAADo/Hc_21K6mVr8/s578-no/%E7%90%AA%E9%9C%B2%E8%AF%BA%E5%A4%B4%E5%83%8F.jpg">
<title>小學四則運算</title>
<link rel="stylesheet"
    href="http://cdn.amazeui.org/amazeui/2.2.1/css/amazeui.min.css" />
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript"
    src="http://cdn.amazeui.org/amazeui/2.2.1/js/amazeui.min.js"></script>




<!-- cookie 用戶名 -->
<script type="text/javascript">
    function getCookie(c_name) {
        if (document.cookie.length > 0) {
            c_start = document.cookie.indexOf(c_name + "=")
            if (c_start != -1) {
                c_start = c_start + c_name.length + 1
                c_end = document.cookie.indexOf(";", c_start)
                if (c_end == -1)
                    c_end = document.cookie.length
                return unescape(document.cookie.substring(c_start, c_end))
            }
        }
        return ""
    }

    function setCookie(c_name, value, expiredays) {
        var exdate = new Date()
        exdate.setDate(exdate.getDate() + expiredays)
        document.cookie = c_name
                + "="
                + escape(value)
                + ((expiredays == null) ? "" : "; expires="
                        + exdate.toGMTString())
    }

    function checkCookie() {
        username = getCookie('username')
        if (username != null && username != "") {
            alert('歡迎你的到來,' + username + '!')
        } else {
            username = prompt('請輸入用戶名:', "")
            if (username != null && username != "") {
                setCookie('username', username, 3)
            }
        }
    }
</script>
</head>
<body class="am-g" style="text-align: center" onload="checkCookie()">
    <h1 class="am-u-lg-6 am-u-md-8 am-u-sm-centered">小學四則運算系統 ver1.0</h1>
    <!--設置 背景色  功能-->
    <h2 class="am-u-lg-6 am-u-md-8 am-u-sm-centered">設置背景顏色</h2>
    <div class="am-u-lg-6 am-u-md-8 am-u-sm-centered">
        <div  data-am-button>
            <label class="am-btn am-btn-default"> <input type="radio"
                name="options" value="white" > 白色
            </label> <label class="am-btn am-btn-primary"> <input type="radio"
                name="options" value="#0e90d2" > 藍色
            </label> <label class="am-btn am-btn-secondary"> <input type="radio"
                name="options" value="#3bb4f2" > 淡藍色
            </label> <label class="am-btn am-btn-success"> <input type="radio"
                name="options" value="#5eb95e" > 綠色
            </label> <label class="am-btn am-btn-warning"> <input type="radio"
                name="options" value="#f37b1d" > 橙色
            </label> <label class="am-btn am-btn-danger"> <input type="radio"
                name="options" value="#dd514c" > 紅色
            </label>
        </div>
        <hr data-am-widget="divider" style=""
            class="am-divider am-divider-default" />
    </div>
    <script type="text/javascript">
        // 获取选中的值
        $(document).ready(
                function() {
                    $(function() {
                        var $radios = $('[name="options"]');
                        $radios.on('change', function() {
                            console.log('单选框当前选中的是：', $radios
                                    .filter(':checked').val());
                        });
                    });

                    $("#color").click(
                            function() {
                                $("body").css(
                                        "background-color",
                                        $('input[name="options"]').filter(
                                                ':checked').val());
                            });
                });
    </script>





    <!-- 設置 題目 數量 -->
    <form name="form" class="am-form-inline" role="form" action="SE2_1.jsp"
        method="post">
        <div class="am-form-group">
            <span>請輸入題目數量:</span> <input name="number" type="number" min="1"
                max="5" class="am-form-field" placeholder="題數">
        </div>
        <button type="submit" class="am-btn am-btn-default">確定</button>
    </form>
</body>
</html>
View Code