html与java的巧妙结合

[color=indigo]当我们用html写了一个页面,有时候我们还想再页面的基础上加上很多功能,直接在html上写代码可能会比较麻烦或者不易实现,我们将html与java结合起来,使在html中可以用到java的代码。
首先我们在java中新建一个web工程,名为web1。我们需要用到的html文件放在webcontent文件下,java文件放在src下面。我们先在webcontent新建一个html文件,写一个页面。文件名为login.html[/color]

<html>
<head>
<title>登陆界面</title>
<style type="text/css">
h1 {color:red}
</style>
</head>
<h1 align=center color=yellow>欢迎来到登陆界面</h1>

<body >
<div align=center>
<form action="">
<img src="Koala.jpg" alt="动物"/>
<br/>
<label for=pass>用户名:</label>
<input type="text" name="passname" id="pass"/>
<br/>
<label for=pass1>密码:</label>
<input type="password" name="passpwd" id="pass1"/>
<br/>
<input type="submit" value="登陆" />
<br/>
<br/>
<br/>
<select name="fruit">

<option value="apple">apple</option>
<option value="banana">banana</option>
</select>
</form>
</div>
</body>

</html>

[color=indigo]
接着我们在新建的web工程下原有的web.xml文件中定义和配置servlet映射,当然在此之前不要忘了在Servers中add一下web工程。
在web.xml中配置servlet代码如下[/color]


<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
<display-name>web1</display-name>
<welcome-file-list>
<welcome-file>login.html</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>loginweb</servlet-name>
<servlet-class>loginweb.loginweb</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>loginweb</servlet-name>
<url-pattern>/login</url-pattern>
</servlet-mapping>
</web-app>

[color=indigo]
我们现在开始在src下写一个名为loginweb.java的java文件[/color]

package loginweb;

import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class loginweb extends HttpServlet{

protected void doGet(HttpServletRequest req,
HttpServletResponse resp)throws ServletException,
java.io.IOException{
// 获取输出流
PrintWriter out=resp.getWriter();
out.println("<h1>hello world!</h1>");
out.flush();
out.close();
}

protected void doPost(HttpServletRequest req,
HttpServletResponse resp)throws ServletException,
java.io.IOException{

//获取输入流
String passname=req.getParameter("passname");
String passpwd=req.getParameter("passpwd");
//对输出流进行编码
resp.setCharacterEncoding("gb2312");
PrintWriter out=resp.getWriter();
// 在java中写html文件
out.write("<html><head>");
if("admin".equals(passname)&&"111".equals(passpwd)){
System.out.println("登陆成功");
// 登陆成功后暂停5秒并且跳转到百度页面
out.write("<meta http-equiv='Refresh' " +
"content='5;url=http://www.baidu.com'/>");
}else{
// 登陆失败后暂停五秒跳回登陆界面
out.write("<meta http-equiv='Refresh' " +
"content='5;url=login.html'/>");
}

out.write("</head><body>");
if("admin".equals(passname)&&"111".equals(passpwd)){
System.out.println("登陆成功");
out.write("<p>登陆成功,五秒钟后跳转到" +
"<a href='www.baidu.com'>主页</a></p>");

}else{
out.write("<p>登陆失败,五秒钟后跳转到" +
"<a href='login'>登陆界面</a></p>");

}
out.write("</body></html>");
out.flush();
out.close();

}

}


[color=indigo]最后在登陆界面的login.html代码中改一下form表单属性如下[/color]

<form method="Post" action="login">


[color=indigo]现在奇迹要发生了,在你的浏览器中输入http://127.0.0.1:8080/web1/看看会发生什么事情吧![/color]
  • 12
    点赞
  • 68
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值