使用IDEA学习JSP代码第004课

最新推荐文章于 2023-10-16 21:43:33 发布
最新推荐文章于 2023-10-16 21:43:33 发布
阅读量113 收藏
点赞数
分类专栏： Java 文章标签： intellij-idea 学习 java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/modern358/article/details/125192388
版权
这是一个关于HTML表单的示例，包括各种输入类型如text, password, color, date, datetime-local等，以及button, reset按钮，checkbox, radio和不同形式的布局展示，如inline, horizontal。示例还涵盖了textarea、disabled字段、帮助提示、状态反馈等元素。
摘要由CSDN通过智能技术生成

new333.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">
    <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>

</head>
<body>
    <h2>表单</h2>
    <hr>
    <div class="container">
        <form>
            <div class="form-group">
                <label for="control1">text</label>
                <input type="text" id="control1" class="form-control">
            </div>
            <div class="form-group">
                <label for="control2">password</label>
                <input type="password" id="control2" class="form-control">
            </div>
            <div class="form-group">
                <label for="control3">color</label>
                <input type="color" id="control3" class="form-control">
            </div>
            <div class="form-group">
                <label for="control4">date</label>
                <input type="date" id="control4" class="form-control">
            </div>
            <div class="form-group">
                <label for="control5">datetime-local</label>
                <input type="datetime-local" id="control5" class="form-control">
            </div>
            <div class="form-group">
                <label for="control6">email</label>
                <input type="email" id="control6" class="form-control">
            </div>
            <div class="form-group">
                <label for="control7">file</label>
                <input type="file" id="control7" class="form-control">
            </div>
            <div class="form-group">
                <label for="control9">month</label>
                <input type="month" id="control9" class="form-control">
            </div>
            <div class="form-group">
                <label for="control10">number</label>
                <input type="number" id="control10" class="form-control">
            </div>
            <div class="form-group">
                <label for="control11">range</label>
                <input type="range" id="control11" class="form-control">
            </div>
            <div class="form-group">
                <label for="control12">search</label>
                <input type="search" id="control12" class="form-control">
            </div>
            <div class="form-group">
                <label for="control13">tel</label>
                <input type="tel" id="control13" class="form-control">
            </div>
            <div class="form-group">
                <label for="control14">time</label>
                <input type="time" id="control14" class="form-control">
            </div>
            <div class="form-group">
                <label for="control15">week</label>
                <input type="week" id="control15" class="form-control">
            </div>
            <div class="form-group">
                <label for="control16">url</label>
                <input type="url" id="control16" class="form-control">
            </div>
            <div class="form-group">
                <input type="button" id="control17" class="form-control" value="button">
            </div>
            <div class="form-group">
                <input type="reset" id="control18" class="form-control" value="reset">
            </div>
            <div class="form-group">
                <input type="checkbox" id="control19">
                <label for="control19">checkbox</label>
            </div>
            <div class="form-group">
                <input type="radio" id="control20" >
                <label for="control20">radio</label>
            </div>
        </form>
    </div>
    <hr>
    <div class="container">
        <form class="form-inline">
            <div class="form-group">
                <label for="username">username</label>
                <input type="text" class="form-control" id="username" placeholder="username">
            </div>
            <div class="form-group">
                <label for="pwd">pwd</label>
                <input type="password" class="form-control" id="pwd" placeholder="pwd">
            </div>
            <button type="submit" class="btn btn-default">登录</button>
        </form>
    </div>
    <hr>
    <div class="container">
        <form class="form-horizontal">
            <div class="form-group">
                <label for="control21" class="col-md-2 control-label">text</label>
                <div class="col-md-9">
                    <input type="text" id="control21" class="form-control">
                </div>
            </div>
            <div class="form-group">
                <label for="control22" class="col-md-2 control-label">password</label>
                <div class="col-md-9">
                    <input type="password" id="control22" class="form-control">
                </div>
            </div>
        </form>
    </div>
</body>
</html>

new334.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">
    <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>

</head>
<body>
    <div class="container">
        <textarea class="form-control" rows="5"></textarea>
        <div class="checkbox">
            <label>
                <input type="checkbox" value="">
                Option one is this and that&mdash;be sure to include why it's great
            </label>
        </div>
        <div class="checkbox disabled">
            <label>
                <input type="checkbox" value="" disabled>
                Option two is disabled
            </label>
        </div>

        <div class="radio">
            <label>
                <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
                Option one is this and that&mdash;be sure to include why it's great
            </label>
        </div>
        <div class="radio">
            <label>
                <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
                Option two can be something else and selecting it will deselect option one
            </label>
        </div>
        <div class="radio disabled">
            <label>
                <input type="radio" name="optionsRadios" id="optionsRadios3" value="option3" disabled>
                Option three is disabled
            </label>
        </div>
        <div class="checkbox">
            <label>
                <input type="checkbox" value="">
                运动
            </label>
        </div>
        <label class="checkbox-inline">
            <input type="checkbox" id="c1" value="">苹果
        </label>
        <label class="checkbox-inline">
            <input type="checkbox" id="c2" value="">苹果
        </label>
        <label class="checkbox-inline">
            <input type="checkbox" id="c3" value="">苹果
        </label>
        <label class="checkbox-inline">
            <input type="checkbox" id="c4" value="">苹果
        </label>
        <br>
        <label>
            <input type="radio" name="sex" id="f1" value="">性别
        </label>
        <label>
            <input type="radio" name="sex" id="f2" value="">性别
        </label>
        <label>
            <input type="radio" name="sex" id="f3" value="">性别
        </label>
        <br>
        <select class="form-control">
            <option>选项</option>
            <option>选项</option>
            <option>选项</option>
            <option>选项</option>
            <option>选项</option>
        </select>
        <br>
        <form class="form-horizontal">
            <div class="form-group">
                <label class="col-md-1 control-label" for="p1">标签</label>
                <div class="col-md-5">
                    <p class="form-control-static" id="p1">静态标签</p>
                </div>
            </div>
            <div class="form-group" >
                <label class="control-label col-md-1" for="t1">text</label>
                <div class="col-md-5">
                    <input type="text" id="t1" value="" placeholder="text" class="form-control">
                </div>
            </div>
        </form>
        <br>
        <form>
            <fieldset disabled>
                <h3>disabled fieldset</h3>
                <div class="form-group">
                    <label for="in1">禁用的输入框</label>
                    <input type="text" id="in1" class="form-control" placeholder="禁止输入内容">
                </div>
                <div class="form-group">
                    <label for="select1">禁用的下拉框</label>
                    <select id="select1" class="form-control">
                        <option>禁用</option>
                    </select>
                </div>
                <div class="checkbox">
                    <label>
                        <input type="checkbox"> 无法选择
                    </label>
                </div>
                <button type="submit" class="btn btn-primary">无法提交</button>
            </fieldset>
        </form>
        <br>
        <form>
            <label for="help1">带有帮助提示的标签</label>
            <input type="text" id="help1" class="form-control" aria-describedby="helpBlock1">
            <span id="helpBlock1" class="help-block">提示性的文本内容</span>
        </form>
        <br>
        <form>
            <div class="form-group has-success">
                <label class="control-label" for="inputSuccess1">带有成功提示的</label>
                <input type="text" class="form-control" id="inputSuccess1" aria-describedby="helpBlock3">
                <span id="helpBlock3" class="help-block">提示的内容</span>
            </div>
            <div class="form-group has-warning">
                <label class="control-label" for="inputWarning1">带有警告提示的</label>
                <input type="text" class="form-control" id="inputWarning1">
            </div>
            <div class="form-group has-error">
                <label class="control-label" for="inputError1">带有错误提示的</label>
                <input type="text" class="form-control" id="inputError1">
            </div>
            <div class="has-success">
                <div class="checkbox">
                    <label>
                        <input type="checkbox" id="checkboxSuccess" value="option1">
                        选择成功
                    </label>
                </div>
            </div>
            <div class="has-warning">
                <div class="checkbox">
                    <label>
                        <input type="checkbox" id="checkboxWarning" value="option1">
                        选择警告
                    </label>
                </div>
            </div>
            <div class="has-error">
                <div class="checkbox">
                    <label>
                        <input type="checkbox" id="checkboxError" value="option1">
                        选择错误
                    </label>
                </div>
            </div>
        </form>
    </div>
</body>
</html>

虾米大王
关注
专栏目录
【jsp新手入门】idea+MySQL+tomcat案例完整代码
xjj1128的博客
10-25 2263
代表servlet程序回传html页面的数据。 jsp页面本质上就是一个servlet程序。 当我们第一次访问jsp页面，tomcat服务器会将页面进行翻译成为.java文件，将它进行翻译成.class文件。
3、Servlet——Servlet、IDEA创建Web项目、IDEA创建JSP页面
CSDN_Loveletter的博客
12-05 3443
一、Servlet的概念 二、Servlet的作用 三、IDEA中创建Web项目 四、手动部署 五、自动部署 1、IDEA部署Tomcat服务器 2、IDEA部署JavaWeb项目 3、JSP页面
使用IDEA学习JSP代码第010课
虾米大王的学习历程
06-19 272
new345.jsp new346.jsp new347.jsp
servlet和jsp在idea写代码的环境配置
高大王天下第一
09-18 367
在idea先进的版本之中是没有直接减里web的选项，需要我们自己去建立。首先右键然后在出来的选项中点击 add framework support 的选项上传之后进入下一个界面选择web application就可以了，出现下面的web包配置就成功了。
IDEA中JSP创建和小案例
cgj-horizons
09-06 2573
JSP在被访问是，有JSP容器（Tomcat）将其转化为Java文件（Servlet），有容器（Tomcat）将其编译，最终对外提供服务的其实就是这个字节码文件。在jsp中， 中没有办法直接嵌套html代码，需要给他分割开， 本案例就是for循环嵌套html代码。由于JSP页面内，既可以定义HTML标签，又可以定义Java代码，造成一下问题。复杂度高，运行需要依赖各种环境，JRE，JSP容器，javaEE。这里要注意一下，你在使用List集合中，要完整的写。用于在JSP页面定义java代码。
使用IDEA学习JSP代码第003课
虾米大王的学习历程
06-10 199
new331.jsp new332.jsp
IDEA中创建编写JSP
热门推荐
qq_45668081的博客
04-28 2万+
一、安装Tmocat并配置环境 安装请参考：https://www.cnblogs.com/weixinyu98/p/9822048.html 安装请参考：https://www.cnblogs.com/zhanlifeng/p/14917777.html 注意：在安装成功Tomcat测试是否成功安装时，访问“http://localhost:8080”前不要关闭cmd和弹出的tomcat。 二、在IEDA中创建jsp项目 1、首先创建一个普通的java项目 2、创建后右击项目名选择——添加框架支持
使用idea将jsp项目部署到本地的服务器详细步骤
最新发布
weixin_56181202的博客
10-16 1308
先创建一个普通的Java项目文件夹 右击刚新建的文件夹 勾选web Application 右击file，选择project structure 2那里是jsp文件编译出来存放的位置，我这里把它调到out文件夹里面，你们也可以放到其他位置，记住了就可以。 接下来就是配置本地的tomcat服务器 运行服务器 最后，如果能跳转到这个页面，就说明你的jsp文件的创建和服务器的部署的已经完成了最后，如果你想新建其他jsp
jsp应用与开发技术第8章源代码（含数据库脚本）.rar
03-20
【描述】提到"jsp应用与开发技术第8章源代码，导入项目即可"，意味着这是一份完整的JSP开发实例，开发者只需将源代码导入到开发环境中，如Eclipse或IntelliJ IDEA，就能运行和学习。这通常包括了Web应用的目录结构，...
Jsp大学实用教程（源代码）
06-28
JSP（Java Server Pages）是一种广泛应用于Web开发的动态网页技术，本资源提供了《JSP大学实用教程》的源代码，供自学者及网站开发人员参考使用。下面是从该资源中提炼出的相关知识点： 1. JSP 简介 JSP是一种基于...
idea使用教程pdf
10-10
### Intellij IDEA 使用教程知识点概览 #### 一、安装与基本配置 - **安装步骤**： - 下载Intellij IDEA安装包。 - 运行安装程序。 - 按照提示进行安装目录的选择。 - 配置桌面快捷方式及文件关联。 - 完成...
完整版：Idea创建Jsp项目
m0_67929407的博客
04-16 2万+
解决办法 ：点击Tomate——EditConfigurations...——再点击右下角标红的Fix——之后再点击前面有蓝色标识的Build...——Apply——OK。10.此时还有一个小问题，发现搜索栏中的项目名称并不是自己建立的项目名称，而是在原有的基础上加了其他字母，更改步骤如下（如果不建议可以不更改）解决方法：此时需在搜索栏写入自己运行的jsp页面的名称，例如我的是1.jsp，这样就不会报错了。Tomcat——Deployment——更改项目名称。左下角出现如图下的即为成功导入Tomcat。
jsp代码实例第351课
虾米大王的学习历程
02-25 7682
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 3755
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 3086
在Spring Boot中使用YAML虽然方便，但是YAML也有一些缺陷，例如无法使用@PropertySource注解加载YAML文件，如果项目中有这种需求，还是需要使用Properties格式的配置文件。YAML是JSON的超集，简洁而强大，是一种专门用来书写配置文件的语言，可以替代application.properties。此时可以将resources目录下的application.properties文件删除，完全使用YAML完成文件的配置。下面是项目具体情况截图。
jsp代码实例第285课
虾米大王的学习历程
01-29 3071
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;
java开发的小游戏 恐龙在奔跑
虾米大王的学习历程
09-18 2970
项目名称是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..
springboot多数据源JdbcTemplate
虾米大王的学习历程
08-09 1473
所谓多数据源，就是一个Java EE项目中采用了不同数据库实例中的多个库，或者同一个数据库实例中多个不同的库。一般来说，采用MyCat等分布式数据库中间件是比较好的解决方案，这样可以把数据库读写分离、分库分表、备份等操作交给中间件去做，Java代码只需要专注于业务即可。不过，这并不意味着无法使用Java代码解决类似的问题，在Spring Framework中就可以配置多数据源，Spring Boot继承其衣钵，只不过配置方式有所变化。
JSP入门：环境安装与配置实战指南
"本课程主要关注JSP的基础模块学习，包括JSP运行环境的安装与配置，以及如何创建第一个JSP程序。课程由刘维娜主讲，旨在让学生理解B/S模式的应用系统开发，特别是通过JSP技术实现。课程内容涉及JSP的基本概念，JSP...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

打赏作者

虾米大王

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

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

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

打赏作者

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

抵扣说明：

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

余额充值