使用IDEA学习JSP代码第024课

最新推荐文章于 2024-08-06 18:52:18 发布
最新推荐文章于 2024-08-06 18:52:18 发布
阅读量64 收藏
点赞数
分类专栏： Java 文章标签： intellij-idea 学习 bootstrap
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/modern358/article/details/125192993
版权

new385.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>bootstrap + jsp 的使用</title>
    <link rel="stylesheet" href="../other/boot/css/bootstrap.min.css">
    <script type="text/javascript" src="../other/jQuery/jQuery-3.4.1.js"></script>
    <script type="text/javascript" src="../other/boot/js/bootstrap.min.js"></script>

    <script type="text/javascript">
        $(function () {

            //
            $("#btn01").click(function () {
                $("#div2").show();
            });

            $("#btn02").click(function () {
               $("#div2").hide();
            });

            $("#btn03").click(function () {
               $("#div2").toggle();
            });
        });
    </script>


</head>
<body>
    <div>
        <button id="btn01" class="btn btn-default">SHOW</button>
        <button id="btn02" class="btn btn-default">HIDE</button>
        <button id="btn03" class="btn btn-default">TOGGLE</button>
    </div>
    <br>
    <br>

    <div style="background-color: #1b6d85;width: 200px;height: 200px;" id="div2">
        div
    </div>
</body>
</html>

new386.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>bootstrap + jsp 的使用</title>
    <link rel="stylesheet" href="../other/boot/css/bootstrap.min.css">
    <script type="text/javascript" src="../other/jQuery/jQuery-3.4.1.js"></script>
    <script type="text/javascript" src="../other/boot/js/bootstrap.min.js"></script>

    <script type="text/javascript">
        $(function () {

            //
            $("#btn01").click(function () {
                $("#div2").show(1000);
            });

            $("#btn02").click(function () {
               $("#div2").hide(1000);
            });

            $("#btn03").click(function () {
               $("#div2").toggle(1000);
            });
        });
    </script>


</head>
<body>
    <div>
        <button id="btn01" class="btn btn-default">SHOW</button>
        <button id="btn02" class="btn btn-default">HIDE</button>
        <button id="btn03" class="btn btn-default">TOGGLE</button>
    </div>
    <br>
    <br>

    <div style="background-color: #1b6d85;width: 200px;height: 200px;" id="div2">
        div
    </div>
</body>
</html>

new387.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>bootstrap + jsp 的使用</title>
    <link rel="stylesheet" href="../other/boot/css/bootstrap.min.css">
    <script type="text/javascript" src="../other/jQuery/jQuery-3.4.1.js"></script>
    <script type="text/javascript" src="../other/boot/js/bootstrap.min.js"></script>

    <script type="text/javascript">
        $(function () {

            //
            $("#btn01").click(function () {
                $("#div2").show(1000,function () {
                    alert("回调函数，show执行完成");
                });
            });

            $("#btn02").click(function () {
               $("#div2").hide(1000,function () {
                   alert("回调函数，hide执行完成")
               });
            });

            $("#btn03").click(function () {
               $("#div2").toggle(1000,function () {
                   alert("回调函数，toggle执行完成")
               });
            });
        });
    </script>


</head>
<body>
    <div>
        <button id="btn01" class="btn btn-default">SHOW</button>
        <button id="btn02" class="btn btn-default">HIDE</button>
        <button id="btn03" class="btn btn-default">TOGGLE</button>
    </div>
    <br>
    <br>

    <div style="background-color: #1b6d85;width: 200px;height: 200px;" id="div2">
        div
    </div>
</body>
</html>

虾米大王
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
JSP、JS实现多选全选操作
a281246240的专栏
05-27 5996
类似于淘宝购物车中的多选操作，可以全选操作，也可以部分选择操作 JSP页面显示代码： "+"Apple/苹果6 4.7寸港版删除 "+"Apple/苹果6 4.7寸港版删除 全选代码：   全选 这行代码是用来存放被选择的操作对象的id值； "全选"按钮功能实现代码： $(document).ready(function () { $("#all").cl
jsp代码实例第351课
虾米大王的学习历程
02-25 7658
code351.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body&
jsp新代码第285课
虾米大王的学习历程
05-28 3570
new285.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta
springboot YAML配置
虾米大王的学习历程
08-02 3048
在Spring Boot中使用YAML虽然方便，但是YAML也有一些缺陷，例如无法使用@PropertySource注解加载YAML文件，如果项目中有这种需求，还是需要使用Properties格式的配置文件。YAML是JSON的超集，简洁而强大，是一种专门用来书写配置文件的语言，可以替代application.properties。此时可以将resources目录下的application.properties文件删除，完全使用YAML完成文件的配置。下面是项目具体情况截图。
java开发的小游戏 恐龙在奔跑
虾米大王的学习历程
09-18 2894
项目名称是Dinosaur 在src文件中，建立了4个包，依次是com.mr.main，com.mr.modle，com.mr.service，com.mr.view。 代码文件分别是Start.java，Dinosaur.java，Obstacle.java，FreshThread.java，MusicPlayer.java，ScoreRecorder.java，sound.java，BackgroundImage.java，GamePanel.java，MainFrame.java，Sc..
jsp代码实例第285课
虾米大王的学习历程
01-29 2881
code285.java package pack07; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest;
springboot多数据源JdbcTemplate
虾米大王的学习历程
08-09 1394
所谓多数据源，就是一个Java EE项目中采用了不同数据库实例中的多个库，或者同一个数据库实例中多个不同的库。一般来说，采用MyCat等分布式数据库中间件是比较好的解决方案，这样可以把数据库读写分离、分库分表、备份等操作交给中间件去做，Java代码只需要专注于业务即可。不过，这并不意味着无法使用Java代码解决类似的问题，在Spring Framework中就可以配置多数据源，Spring Boot继承其衣钵，只不过配置方式有所变化。
springboot+vue+mybatisplus前后端分离项目-学生成绩管理系统（01）
虾米大王的学习历程
11-06 1236
使用idea工具，新建springboot项目，
springboot+vue小白升级之路16-集成echarts（饼图、柱状图、折线图）实现数据统计
虾米大王的学习历程
11-22 1230
我们还是接着前面的内容，我把新增的功能代码贴出来，供大家学习参考。
springboot 整合Thymeleaf
虾米大王的学习历程
08-02 1210
ThymeleafSpring Boot为Thymeleaf提供了自动化配置类ThymeleafAutoConfiguration，相关的配置属性在ThymeleafProperties类中，由此配置可以看到，默认的模板位置在classpath:/templates/，默认的模板后缀为.html。与传统Java模板引擎不同的是，Thymeleaf支持HTML原型，既可以让前端工程师在浏览器中直接打开查看样式，也可以让后端工程师结合真实数据查看显示效果。
spring mybatis 动态SQL的where标签
虾米大王的学习历程
08-01 1119
假如在where条件中使用if标签的SQL语句中，where 1=1这个条件是不希望存在的，此类问题就可以用trim、where、set三个标签来解决。② 当if语句中有条件满足时，SQL中需要有where，且第一个成立的if标签下的and或or等要去掉。where标签和set标签都是trim标签的一种类型，下面首先介绍where标签和set标签。如果where标签后面的字符串是以and和or开头的，就将它们剔除。① 当条件都不满足时，SQL中不能有where，否则会导致出错。
spring mybatis 动态SQL的update
虾米大王的学习历程
08-01 1050
在UPDATE 更新列中使用if标签有时候不希望更新所有的字段，只更新有变化的字段。（1）需求：只更新有变化的字段，空值不更新。
jsp新代码第289课
虾米大王的学习历程
05-28 1050
new289.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta
spring mybatis 动态SQL的insert
虾米大王的学习历程
08-01 1014
插入数据库的记录中，不是每一个字段都有值，此时就可以使用if标签。在INSERT 动态插入中使用if标签。（1）条件：只有非空属性才插入。
springboot 整合JdbcTemplate
虾米大王的学习历程
08-09 931
Spring Boot中对JdbcTemplate的使用提供了自动化配置类JdbcTemplateAutoConfiguration，当classpath下存在DataSource和JdbcTemplate并且DataSource只有一个实例时，自动配置才会生效，若开发者没有提供JdbcOperations，则Spring Boot会自动向容器中注入一个JdbcTemplate（JdbcTemplate是JdbcOperations的子类）。• 创建BookDao，注入JdbcTemplate。
jsp新代码第315课
虾米大王的学习历程
06-06 834
new315.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta
IDEA自定义注释模版
m0_46202211的博客
08-06 106
模版中的自定义参数@params和@returns可以自动展开参数列表和返回值，具体在Edit Variables中设置Groovy脚本并勾选上。先自定义一个模版组，然后在里面添加模版名，触发快捷键（Tab/Enter），模版描述，哪些语言中应用。1.类（接口/枚举等同理）@returns脚本。
使用idea 把一个git分支的部分提交记录合并到另一个git分支上
weixin_40873693的博客
08-06 187
7、此时代码只是在自己本地提交了，未推送到git上，需要。项目右键，git—>push,把要合并的内容推送到分支B（被合并分支）上即可。需要将A（合并分支）分支上的提交记录中的某一次（或几次）提交合并到B（被合并分支）分支上。4.然后点击“Cherry-Pick”图标；1、idea切换项目分支到被合并的分支B分支；3.在提交的记录内容中点击选中要合并的记录；5.如果要合并多个提交记录，重复步骤3和4；6、若在合并时有冲突则需要解决冲突。2、找到需要合并的分支A。二、使用工具：idea。
在idea中将JDK17换成JDK8
最新发布
weixin_53908084的博客
08-06 87
JDK版本的切换
idea 注释jsp代码
03-27
JSP（Java Server Pages）是一种用于创建动态网页的Java技术。...第二个注释是在循环中使用的，以帮助读者理解代码的功能。这些注释不会影响页面的运行，但它们可以提供信息和帮助，使代码更容易阅读和维护。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

虾米大王

有你的支持，我会更有动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值