5-1问题,js找不到路径

来源:5-1 完成验证功能

qq_9o後虛徦_0

2018-06-18 01:03:20

<?xml version="1.0" encoding="UTF-8"?>

<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"

         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"

         version="3.1">


    <!--关于kaptcha验证码的配置-->

   <!-- <servlet>

        <servlet-name>Kaptcha</servlet-name>

        <servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class>

    </servlet>

    <servlet-mapping>

        <servlet-name>Kaptcha</servlet-name>

        <url-pattern>/kaptcha.jpg</url-pattern>

    </servlet-mapping>-->

    <servlet>

        <servlet-name>Kaptcha</servlet-name>

        <servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class>

        <init-param>

            <param-name>kaptcha.border</param-name>

            <param-value>no</param-value>

        </init-param>

        <init-param>

            <param-name>kaptcha.image.width</param-name>

            <param-value>100</param-value>

        </init-param>

        <init-param>

            <param-name>kaptcha.image.height</param-name>

            <param-value>40</param-value>

        </init-param>

        <init-param>

            <param-name>kaptcha.textproducer.font.size</param-name>

            <param-value>28</param-value>

        </init-param>

        <init-param>

            <param-name>kaptcha.textproducer.char.string</param-name>

            <param-value>qwertyuiopasdfghjklzxcvbnm123456789</param-value>

        </init-param>

        <init-param>

            <param-name>kaptcha.textproducer.char.length</param-name>

            <param-value>4</param-value>

        </init-param>

        <init-param>

            <param-name>kaptcha.noise.impl</param-name>

            <param-value>com.google.code.kaptcha.impl.DefaultNoise</param-value>

        </init-param>

        <init-param>

            <param-name>kaptcha.obscurificator.impl</param-name>

            <param-value>com.google.code.kaptcha.impl.FishEyeGimpy</param-value>

        </init-param>

        <init-param>

            <!--session.setAttribute("kcode",生成好的验证吗)-->

            <param-name>kaptcha.session.key</param-name>

            <param-value>kcode</param-value>

        </init-param>

    </servlet>

    <servlet-mapping>

        <servlet-name>Kaptcha</servlet-name>

        <url-pattern>/kaptcha.jpg</url-pattern>

    </servlet-mapping>

    <servlet>

        <servlet-name>LoginServlet1</servlet-name>

        <servlet-class>com.imooc.code.LoginServlet1</servlet-class>

    </servlet>

    <servlet-mapping>

        <servlet-name>LoginServlet1</servlet-name>

        <url-pattern>/login</url-pattern>

    </servlet-mapping>



</web-app>




package com.imooc.code;


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;

import javax.servlet.http.HttpServletResponse;


/**

 * Servlet implementation class LoginServlet11

 */

@WebServlet("/LoginServlet1")

public class LoginServlet1 extends HttpServlet {

private static final long serialVersionUID = 1L;

       

   

    public LoginServlet1() {

        super();

        // TODO Auto-generated constructor stub

    }


protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

// TODO Auto-generated method stub

System.out.println("doGet");

request.setCharacterEncoding("UTF-8");

response.setCharacterEncoding("UTF-8");

//需要获取浏览器输出流对象

PrintWriter out = response.getWriter();

//获取用户传递过来的验证码

String code = request.getParameter("code");

System.out.println(code);

//获取验证码框架产生的验证码

String sessionCode = (String)request.getSession().getAttribute("kcode");

if(code!=null && sessionCode!=null) {

if(code.equalsIgnoreCase(sessionCode)) {

out.print("success");

}

}else {

out.print("fail");

}

out.flush();

out.close();

}


protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

// TODO Auto-generated method stub

doGet(request, response);

}


}




<%--

  Created by IntelliJ IDEA.

  User: Administrator

  Date: 2017/9/8

  Time: 21:10

  To change this template use File | Settings | File Templates.

--%>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<html>

<head>

    <title>登录</title>

    <style>#code{height:30px;}</style>

</head>

<body>


<form action="submit.action">


    <p> <input type="text" name="kaptcha" id="code" value="" maxlength="4" placeholder="请输入验证码"/>

    <img src="http://localhost:8080/imooccode/kaptcha.jpg" id="changecode"/>

    </p>

    <p>

    <input type="button" id="login" value="登录">

    </p>

    <div id="result"></div>

</form>


<script src="js/jquery-1.12.4.min.js" type="text/javascript"></script>

<script>

    $(function(){

        $("#changecode").on("click",function(){

            $(this).attr("src","http://localhost:8080/imooccode/kaptcha.jpg?d="+new Date().getTime());

        });

         //给登录按钮绑定点击事件

        $("#login").on("click",function(){

            //获取用户输入的验证码

            var code = $("#code").val();

            alert(code);

            System.out.println(code);

            var params = {"code":code};

            $.post("http://localhost:8080/imooccode/login",params,function(data){

//                if(data=="fail"){

//                     alert("验证码输入有误!");

//                }

                if(data=="success"){

                    $("#result").html("验证码输入正确");

                }else{

                    $("#result").html("验证码输入有误,请重新输入...");

                    $("#code").val("").focus();

                }

            });

        });

    })


</script>


</body>

</html>



http://img.mukewang.com/climg/5b26942d00012efd07560309.jpg

http://img.mukewang.com/climg/5b26943a000154ff07730281.jpg

http://img.mukewang.com/climg/5b26943f000192c407380785.jpg

写回答

1回答

一叶知秋519

2018-06-18

你的js文件需要放到webContent目录下~~

0

0 学习 · 10204 问题

查看课程