点击按钮没反应

先上代码：

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%
    String basePath = request.getScheme() + ":" + "//" + request.getServerName() + ":" + request.getServerPort() + "/"
                        + request.getServletContext().getContextPath();
     
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>图书查询</title>
<script type="text/javascript" src="<%=basePath%>/resources/js/jquery-1.4.2.js">
    $("#search").click(function(){
        alert("Hello");
    });
</script>
<%-- <!-- 使用jquery实现Ajax -->
<script type="text/javascript">
     
    $("#search").click(function() {
        window.alert("hello");
        //单击查询按钮的时候触发ajax事件
        alert("hello");
        $.ajax({
            url:"<%=basePath%>/SelectServlet",
            type:"post",
            data:{
                bookID:$("input[name=bookID]").val(),
                bookName:$("input[name=bookName]").val(),
                catgoryName:$("input[name=catgoryName]").val()
            },
            //dataType指明Servlet给Ajax返回数据的数据格式
            dataType:"json",
            //result中存储了Servlet给Ajax返回数据的数据格式$("#music1").text(result.song1);
            success:function(result) {
                var selectedBook = eval(result);
                var content = null;
                for(var i in selectedBook) {
                    var id = selectedBook[i].id;
                    var name = selectedBook[i].name;
                    var type = selectedBook[i].type;
                    var price = selectedBook[i].price;
                    var description = selectedBook[i].description;
                    content = content + "<tr><td>" + id + "</td><td>" + name + "</td><td>" + type + "</td><td>"
                                + price + "</td><td>" + description + "</td></tr>";
                }
                $("#cont>tr").remove();
                $("#cont").html(content);
            }
        }); 
    });
 
</script> --%>
</head>
<body>
    <center>
        <h1>图书查询</h1>
        <p>
            图书ID：<input type="text" name="bookID">
            图书名：<input type="text" name="bookName">
            分类：<input type="text" name="catgoryName">
            <input type="button" value="查询" id="search">
        </p>
        <hr>
        <table width="800px" cellspacing="0px" cellpadding="0px" border="1px">
            <thead>
                <tr>
                    <th>图书ID</th>
                    <th>书名</th>
                    <th>分类</th>
                    <th>价格</th>
                    <th>描述</th>
                </tr>
            </thead>
            <tbody id="cont">
                <c:forEach items="${books }" var="Book">   
                    <tr>
                        <td>${Book.id}</td>
                        <td>${Book.name}</td>
                        <td>${Book.type}</td>
                        <td>${Book.price}</td>
                        <td>${Book.description}</td>
                    </tr>
                </c:forEach>
            </tbody>
        </table>
    </center>
</body>
</html>

因为点击按钮一直没反应，所以我就把点击按钮的功能变成了简单的弹窗功能，结果点击按钮还是没反应。浏览器的控制台不报任何错误，点击按钮没有任何反应。

慕数据4154996 2018-08-28

源自：监听器 2-5 作业题

收起

2回答

chrismorgen 回答被采纳获得+3积分 2018-08-29 11:44:56

有时页面无反应时，应该先去Consloe中查看是否有错误信息，譬如下图样式，而Sources是查看代码中是否有编译错误。是的，jsp页面中的代码执行顺序是从上向下执行的，所以需要将js代码写在底部。祝学习愉快~

收起回答

慕数据4154996 提问者 #1

可是老师，我在注册页面里用js校验两次输入密码是否一致的时候，把js写在前面没有问题啊。

2018-08-29 15:50:25
chrismorgen 回复提问者慕数据4154996 #2

你在校验密码的时候是通过input标签中的方法来触发js代码代码的吧？如果是，将js代码放到上面也是可以触发的，祝学习愉快~

2018-08-29 16:43:21
慕数据4154996 提问者回复 chrismorgen #3

是的，我在标签里设置了onblur来触发函数

2018-08-29 16:58:48