会员可以在此提问,百战程序员老师有问必答
对大家有帮助的问答会被标记为“推荐”
看完课程过来浏览一下别人提的问题,会帮你学得更全面
截止目前,同学们一共提了 132496个问题
JAVA 全系列/预科阶段:职业规划/学习方法/JAVA 技术体系介绍和学习方法 23191楼
Python 全系列/第二阶段:Python 深入与提高/GUI编程(隐藏) 23193楼
Python 全系列/第二阶段:Python 深入与提高/GUI编程(隐藏) 23194楼
WEB前端全系列/第十一阶段:Nodejs编程模块--/Less 23195楼

老师帮忙看看,添加不进去数据

users

package com.bjsxt.pojo;

import com.fasterxml.jackson.annotation.JsonFormat;

import java.util.Date;

//创建项目的Users类
public class Users {
    private int userid;

    public int getUserid() {
        return userid;
    }

    public void setUserid(int userid) {
        this.userid = userid;
    }

    public String getUsername() {
        return username;
    }

    public void setUsername(String username) {
        this.username = username;
    }

    public String getUsersex() {
        return usersex;
    }

    public void setUsersex(String usersex) {
        this.usersex = usersex;
    }

    public Date getUserbirth() {
        return userbirth;
    }

    public void setUserbirth(Date userbirth) {
        this.userbirth = userbirth;
    }

    private String username;
    private String usersex;
    //指定显示格式
    @JsonFormat(pattern = "yyyy-MM-dd",timezone = "GMT + 8")
    private Date userbirth;
}

servlet

package com.bjsxt.servlet;

import com.bjsxt.common.JsonUtils;
import com.bjsxt.pojo.Users;
import org.omg.PortableServer.LIFESPAN_POLICY_ID;

import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.awt.*;
import java.io.IOException;
import java.io.PrintWriter;
import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;

//用户管理Servlet
@WebServlet("/users.do")
public class UsersServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        this.doPost(req, resp);
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String flag = req.getParameter("flag");
        if ("getData".equals(flag)) {
            this.getData(req, resp);
            //判断flag是否为addUser
        } else if ("addUser".equals(flag)) {
            this.addUser(req, resp);
        }
    }

    private void getData(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //获得页面初始化数据
        List<Users> list = (List<Users>) this.getServletContext().getAttribute("list");
        String s = JsonUtils.objectToJson(list);
        resp.setContentType("application/json");
        PrintWriter pw = resp.getWriter();
        pw.print(s);
        pw.flush();
        pw.close();

    }

    //添加用户的方法
    private void addUser(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //首先调用获取数据的方法
        Users date = this.getDate(req);
        ServletContext servletContext = this.getServletContext();
        List<Users> list = (List<Users>) this.getServletContext().getAttribute("list");
        list.add(date);
        //设置提示信息的响应格式
        resp.setContentType("text/plain;charset=utf-8");
        PrintWriter pw = resp.getWriter();
        pw.print("添加成功!");
        pw.flush();
        pw.close();
    }

    //生成模拟数据初始化
    @Override
    public void init() throws ServletException {
        Users user = new Users();
        user.setUserid(1);
        user.setUsername("cheng");
        user.setUsersex("man");
        user.setUserbirth(new Date());
        Users user2 = new Users();
        user2.setUserid(2);
        user2.setUsername("jun");
        user2.setUsersex("man");
        user2.setUserbirth(new Date());
        //创建数组,进行数据的存放
        List<Users> list = new ArrayList<>();
        list.add(user);
        list.add(user2);
        ServletContext servletContext = this.getServletContext();
        //添加数据
        servletContext.setAttribute("list", list);
    }

    //获取请求数据
    private Users getDate(HttpServletRequest req) {
        String userid = req.getParameter("userid");
        String username = req.getParameter("username");
        String usersex = req.getParameter("usersex");
        String userbirth = req.getParameter("userbirth");
        //创建对象,添加获取的数据
        Users users = new Users();
        users.setUserid(Integer.parseInt(userid));
        users.setUsername(username);
        users.setUsersex(usersex);
        //进行格式的规定
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
        try {
            //格式转化
            Date parse = sdf.parse(userbirth);
            //添加信息
            users.setUserbirth(parse);
        } catch (ParseException e) {
            e.printStackTrace();
        }
        //返回Users对象
        return users;
    }
}

jsp

<%--
  Created by IntelliJ IDEA.
  User: 
  Date: 2021/3/30
  Time: 11:48
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户管理</title>
    <%--    引入样式--%>
    <script src="js/jquery.js"></script>
    <script>
        $(function () {
            //获取初始化数据
            getDate();
            //添加用户绑定事件
            $("#add").click(function () {
                addOrUpdateUser("addUser");
            })
        });

        //定义获得数据
        function getDate() {
            $.getJSON("users.do", {flag: "getData"}, function (result) {
                init(result);
            })
        }

        //遍历数组生成数据
        function init(obj) {
            var str = "";
            $.each(obj, function () {
                str += "<tr align='center'><td id='" + this.userid + "'>" + this.userid + "</td><td>" + this.username + "</td><td>" + this.usersex + "</td><td>" + this.userbirth + "</td><td><a href='#' onclick='preUpdateUser()'>选择更新</a>&nbsp;&nbsp;&nbsp;<a href='#' onclick='deleteUser(" + this.userid + ")'>删除</a></td></tr>"
            });
            //拼接字符串
            $("#tBody").prepend(str);
        }

        //添加用户或者是用户更新数据事件方法
        function addOrUpdateUser(flag) {
            //获取数据
            var userid = $("#userid").val();
            var username = $("#username").val();
            var usersex = $("#usersex").val();
            var userbirth =$("#userbirth").val();
            var date = {
                userid:userid,
                username:username,
                usersex:usersex,
                userbirth:userbirth,
                flag:flag
            }
            //刷新页面
            location.reload();
            $.get("user.do",date,function (result){
                alert(result);
            });
        }
    </script>
</head>
<body>
<table align="center" width="60%" border="1">
    <tr>
        <td>ID:</td>
        <td><input type="text" name="userid" id="userid"/></td>
        <td>姓名:</td>
        <td><input type="text" name="username" id="username"/></td>
    </tr>
    <tr>
        <td>性别:</td>
        <td><input type="text" name="usersex" id="usersex"/></td>
        <td>生日:</td>
        <td><input type="text" name="userbirth"
                   id="userbirth"/></td>
    </tr>
    <tr align="center">
        <td colspan="4">
            <input type="button" value="添加用户" id="add"/>18
            <input type="button" value="更新用户" id="update"/>
        </td>
    </tr>
</table>
<hr/>
<table align="center" width="60%" bgcolor="" border="1"
       id="myTable">
    <thead>
    <tr align="center">
        <td>ID</td>
        <td>姓名</td>
        <td>性别</td>
        <td>生日</td>
        <td>操作</td>
    </tr>
    </thead>
    <tbody id="tBody"></tbody>
</table>
</body>
</html>


JAVA 全系列/第五阶段:JavaWeb开发/Ajax技术详解(旧) 23196楼

问题:关于径向渐变语法设置中的渐变形状,渐变中心点,渐变大小的顺序是否因浏览器的不同而不同?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>背景渐变练习</title>
    <style>
        .box1{
            /* 绘制一个圆并设置线性渐变 */
            width:300px;
            height:300px;
            border:5px solid white;
            background-color:red;
            border-radius:50%;
            background-image:linear-gradient(to right bottom,red,orange,yellow,green);
            float:left;
        }
        .box2{
            /* 设置径向渐变 */
            width:300px;
            height:300px;
            margin:10px;
            background-color:chartreuse;
            float:left;
        }
        /* 鼠标悬停在box2上,实现径向渐变效果 */
        .box2:hover{
            /* 为什么top放在circle后效果不显示,而放在circle前才显示效果,老师不是说颜色前的语法顺序是渐变形状、渐变大小、再渐变中心点么? */
            background-image:-webkit-radial-gradient(top,circle,red,orange,yellow,green);
        }
    </style>
</head>
<body>
    <div class="box1"></div>
    <div class="box2"></div>
</body>
</html>

image.png

WEB前端全系列/第一阶段:HTML5+CSS3模块/CSS选择器 23197楼
WEB前端全系列/第十四阶段:React知识体系/React基础知识 23198楼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米</title>
    <link rel="icon" href="../img/favicon.ico">
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/小米官网练习.css">
</head>
<body>
    
<div class="header">
    <a href="#">
        <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/41d16e66381cfeda7b6b39ab67678d5e.jpg?thumb=1&w=1533&h=150&f=webp&q=90" alt="">
    </a>
<!-- 黑色导航 -->
</div>
    <div class="nav">
        <div class="nav-center">
            <ul class="nav-left">
                <li><a href="#">小米商城</a><span>|</span></li>
                <li><a href="#">MIUI</a><span>|</span></li>
                <li><a href="#">loT</a><span>|</span></li>
                <li><a href="#">云服务</a><span>|</span></li>
                <li><a href="#">天星科技</a><span>|</span></li>
                <li><a href="#">有品</a><span>|</span></li>
                <li><a href="#">小爱开放平台</a><span>|</span></li>
                <li><a href="#">企业团购</a><span>|</span></li>
                <li><a href="#">资质证照</a><span>|</span></li>
                <li><a href="#">协议规则</a><span>|</span></li>
                <li class="app">
                    <a href="#">下载APP</a>
                    <span>|</span>
                    <div class="QRcode">
                        <img src="../img/93650133310ec1c385487417a472a26c.png" alt="" class="QRcode-img">
                        <p>小米商城APP</p>
                    </div>
                    <div class="sanjiao"></div>
                </li>
                <li><a href="#">智能生活</a><span>|</span></li>
                <li><a href="#">select location</a></li>
            </ul>   
            <ul class="nav-right">
                <li class="cart">
                    <a href="#">购物车(0)</a>
                    <div class="cart-list">购物车还没有商品,赶紧加入吧</div>
                </li>
                <li><a href="#">信息通知</a></li>
                <li><a href="#">注册</a><span>|</span></li>
                <li><a href="#">登录</a><span>|</span></li>
            </ul>   
        </div>  
    </div>
<!-- 白色导航 -->
<div class="white-nav">
    <div class="white-wrap">
        <div class="logo-mi">
            <a href="#">
                <img src="../img/mi-logo.png" alt="" class="mi-logo">
                <img src="../img/mi-home.png" alt="" class="mi-home">
            </a>
            
        </div>
        <div class="white-nav-center"> 
             <ul>
                <li>
                    <a href="#">
                    <img src="../img/大logo.png" alt="">
                    </a>
                </li>
                <li>
                    <a href="#">小米手机</a>
                    <div class="pull-down">
                        <div class="pull-down-center">
                            <ul>
                                <li>
                                    <a href="#">
                                        <div class="img-box">
                                            <img src="../img/pull-down.jpg" alt="">
                                        </div>
                                        <p>小米10s</p>
                                        <p>3299元起</p>
                                    
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <div class="img-box">
                                            <img src="../img/pull-down1.png" alt="">
                                        </div>
                                        <p>小米11</p>
                                        <p>3999元起</p>                                      
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                <li><a href="#">Redmi 红米</a></li>
                <li><a href="#">电视</a></li>
                <li><a href="#">笔记本</a></li>
                <li><a href="#">家电</a></li>
                <li><a href="#">路由器</a></li>
                <li><a href="#">智能硬件</a></li>
                <li><a href="#">服务</a></li>
                <li><a href="#">社区</a></li>
            </ul> 
        </div>
        <div class="nav-input">
            <input type="text" placeholder="小米之家">
            <button class="button">搜索</button>
               <div class="nav-input-list"></div>
        </div>
    </div>
</div>



</body>
</html>

html部分.

/* 顶部图片隐藏 */
.header{
    width: 100%;
    height: 100%;
    display: none;
}
/* 黑色导航 */
.nav{
    width: 100%;
    height: 40px;
    background-color:#333;
    

}
/* 居中div */
.nav-center{
    width: 1226px;
    height: 100%;
    margin: 0 auto;
}
/* a的字体颜色 */
a{
    color: #b0b0b0;
}
/* 鼠标悬停时字体颜色 */
.nav-center a:hover{
    color: #fff;
}
/* 左侧li浮动 定位*/
.nav-left>li{
    float: left;
    font-size: 12px;
    line-height: 40px;
    position: relative;
}
/* 右侧li浮动 定位*/
.nav-right>li{
    float: right;
    font-size: 12px;
    line-height: 40px;
    position: relative;
}
/* span竖杠(|)的外边距 */
.nav span{
    margin: 0 3.6px;
    color: #424242;
}
/* 购物车:大小 颜色 外边距 */
.cart{
    width: 120px;
    height: 40px;
    background: #424242;
    margin-left: 20px;
}
/* 购物车鼠标悬停时背景颜色 */
.cart:hover{
    background: #fff;
}
/* 购物车鼠标悬停时a的的颜色*/
.cart:hover>a{
    color: #ff6700;
}
/* 购物车下拉列表的属性,1:相对于右侧li定位,隐藏下拉列表,所有属性:all .3s的过度 */
.cart>.cart-list{
    width: 316px;
    /* 高度设置为0隐藏下拉列表 */
    height: 0px;
    background:#fff;
    position: absolute;
    right: 0px;
    top: 40px;
    box-shadow: 0 2px 10px #aaa;
    color: #424242;
    /* 下拉列表的文字溢出部分隐藏 */
    overflow: hidden;
    /* 过度:所有属性 .3s秒速度显示 */
    transition: all .3s;
    /* 在白色导航上边显示出来 */
    z-index: 1;
}
/* 鼠标悬停时显示下拉列表,字体居中 */
.cart:hover>.cart-list{
    height: 100px;
    line-height: 100px;
}
/* app下载的属性中的二维码框设置 */
.app>.QRcode{
   width: 124px;
    /* 高度设置为0隐藏下拉列表 */
   height: 0px;
   background-color:#fff;
   box-shadow: 0 1px 5px #aaa;
   /* 相对于左侧li定位 */
   position: absolute;
   top: 40px;
   left: 50%; 
   margin-left: -66px; 
   /* 下拉列表的文字溢出部分隐藏 */
   overflow: hidden;
   /* 过度:所有属性 .3s秒速度显示 */
   transition:all .3s;
   /* 在白色导航上边显示出来 */
   z-index: 1;
}
/* 二维码图片的设置 */
.QRcode>.QRcode-img{
    width: 90px;
    height: 90px;
    margin: 18px 0 0;
}
/* 二维码框中字体的设置 */
.QRcode>p{
    font-size: 14px;
    line-height: 1;
}
/* 鼠标悬停二维框显示 */
.app:hover>.QRcode{
    height: 148px;
}
/* 小三角的设置:绘制特殊图形的方式写 */
.sanjiao{
    width: 0;
    height: 0;
    border-bottom: 8px solid #fff;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    /* 定位小三角并且隐藏 */
    position: absolute;
    left: 17px;
    top: 32px;
    display: none;
}
/* 鼠标悬停显示小三角 */
.app:hover>.sanjiao{
    display: block;
}
/* 白色导航部分 */
.white-nav{
    width: 100%;
    height: 100px;
    position: relative;
}
/* 居中部分 */
.white-wrap{
    width: 1226px;
    height: 100px;
    margin: 0 auto;
}
/* logo部分 */
.logo-mi{
    width: 55px;
    height: 55px;
    background: #ff6700;
    float: left;
    margin-top: 22.5px;
    /* 定位加隐藏 */
    position: relative;
    overflow: hidden;
    
}
/* 中间文字导航部分 */
.white-nav-center{
    width: 876px;
    height:100px;
    float: left;
}
/* 搜索框部分 */
.nav-input{
    width: 295px;
    height:100px;
    float: right;
    position: relative;
}
/* logo的图片大小 */
.logo-mi>a>img{
    width: 100%;
    height: 100%;
    /* 定位加过渡*/
    position: absolute;
    top: 0;
    transition: all .3s;
}
/* logo-mi-logo定位的设置 */
.mi-logo{
    top: 0;
    left: 0px;
}
/* logo-mi-home定位的设置 */
.mi-home{
    top: 0;
    left: -55px;
}
.logo-mi:hover>a>.mi-home{
    left: 0px;
}
.logo-mi:hover>a>.mi-logo{
    left: 55px;
}
/* 白色导航中间部分 浮动加字体间距 */
.white-nav-center ul>li{
    float: left;
    line-height: 100px;
}
/* 设置a的字体 颜色 内边距 */
.white-nav-center>ul>li>a{
   font-size: 16px;
   color: #333;
   padding:0 10px;
}
/* logo右边图标的调整 */
.white-nav-center>ul>li:first-child{
    margin-top: 9px;
    margin-left: 20px;
    margin-right: 40px;
}
/* 鼠标悬停a的文字变橘色 */
.white-nav-center>ul>li>a:hover{
    color: #ff6700;
}
/* 白色导航栏的下拉列表的属性 */
.pull-down{
    width: 100%;
    height: 230px;
    background: #fff;
    border-top: 1px solid #e0e0e0;
    box-shadow: 0 1px 2px #aaa;
    position: absolute;
    top: 100px;
    left: 0;
    box-sizing: border-box;
    display: none;
    transition: all .5s;
    
}
/* 居中的下拉列表部分 */
.pull-down-center{
    width: 1226px;
    height: 100%;
    background-color: #fff;
    margin: 0 auto;
}
.img-box{
    width: 204px;
    height: 110px;
    border-right:1px solid #bdb8b8 ;
    box-sizing: border-box;
    margin-top: 30px;
    margin-bottom: 15px;
}
.img-box img{
    width: 160px;
    height: 110px;
}
.pull-down-center p{
    font-size: 12px;
    line-height: 20px;
    
}
.pull-down-center p:nth-of-type(1){
    color: #333;
}
.pull-down-center p:nth-of-type(2){
    color:#ff6700;
}
/* 问题:不显示过渡属性 */
.white-nav li:hover>.pull-down{
    display: block;
}


/* input属性 */
.nav-input>input{
    width: 220px;
    height: 50px;
    border: 1px solid #e0e0e0;
    box-sizing: border-box;
    padding: 0 10px;
    margin-top: 23.5px;
    float: left;
    /* 不显示轮廓线 */
    outline: none;
    border-right: none;
    transition:all .3s;
}
/* button按钮属性 */
.nav-input>button{
    width: 52px;
    height: 50px;
    background: #fff;
    border: 1px solid #e0e0e0;
    box-sizing: border-box;
    float: left;
    margin-top: 23.5px;
    /* 不显示轮廓线 */
    outline: none;
    transition:all .3s;
}
/* hover鼠标悬停时的状态 */
.nav-input>input:hover,.nav-input>input:hover+button{
    border-color: #b0b0b0;
}
/* focus(否卡尔时)鼠标获取焦点时的状态 */
.nav-input>input:focus,.nav-input>input:focus+button{
    border-color: #ff6700;
}
/* 鼠标悬停在button按钮上的状态 */
.nav-input>button:hover{
    background-color: #ff6700;
    border-color: #ff6700;
    color: #fff;
}
/* 下拉列表属性 */
.nav-input-list{
    width: 219px;
    height: 240px;
    background-color: #fff;
    border: 1px solid #ff6700;
    border-top:none ;
    /* 在input的div上定位 */
    position: absolute;
    left: 0;
    top: 74px;
    display: none;
}
/* 点击获取焦点时下拉列表出现 */
.nav-input>input:focus~.nav-input-list{
    display: block;
}
/* 以上白色导航结束 */

css部分。小米属性的下拉列表transition不出现过渡属性



WEB前端全系列/第一阶段:HTML5+CSS3模块/CSS3新特性 23199楼
JAVA 全系列/第六阶段:项目管理与SSM框架/Mybatis 23200楼
JAVA 全系列/第八阶段:Linux入门到实战/Maven 23201楼
JAVA 全系列/第二阶段:JAVA 基础深化和提高/容器(旧) 23203楼
JAVA 全系列/第十八阶段:亿级高并发电商项目_架构/编码(旧)/电商:使用RabbitMQ实现大广告异步缓存 23205楼

课程分类

百战程序员微信公众号

百战程序员微信小程序

©2014-2025百战汇智(北京)科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园
网站维护:百战汇智(北京)科技有限公司
京公网安备 11011402011233号    京ICP备18060230号-3    营业执照    经营许可证:京B2-20212637