button单击不能触发事件

button单击没任何反应，直接不触发事件。什么原因呢？？

jsp编码

 <%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Login Page</title>
<style type="text/css">@IMPORT url("css/m.css");</style>
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="js/login.js"></script>
</head>
<body>
<br><br><br><br>
<div class="back">
  <div> 
    <fieldset>
      <legend>JobSite</legend>
      <div class="content">
      <p>
       <label for="tel">手机号码：</label>
       <input type="text" id="tel" name="tel" tabindex="1">
      </p>
      <p>
       <label for="psw">你的密码：</label>
       <input type="password" id="psw" name="psw" tabindex="2">
      </p>
       <a href="/JobSite0/index.html" >返回主页面</a>
       <a href="forget" title="Forget password">忘记密码</a>
      <p>
        <input type="button" tabindex="4" value="学生登录" id="btn1">
        <input type="button" tabindex="5" value="公司登录" id="btn2">
      </p>
      </div>
    </fieldset>  
</div> 
</div>
</body>
</html>

javascript编码

 function $$(id){
  return document.getElementById(id);
 }

    $("#btn1").click(function(){
          alert("学生的登录");
          $.ajax({
               type:"POST",
               url:"/JobSite0/test",
               data:{"tel":$$("tel").value,"psw":$$("psw").value},
               success:function(result){
                   if(result=="true"){
                       location.replace("http://localhost:8888/JobSite0/student");
                   }else{
                       alert("你的用户名或密码错误！");
                   }  
               }
           });
            });

      $("#btn2").click(function(){
          $.ajax({
               type:"POST",
               url:"/JobSite0/test_c",
               data:{"tel":$$("tel").value,"psw":$$("psw").value},
               success:function(result){
                   if(result=="true"){
                       location.replace("/JobSite0/company");
                   }else{
                       alert("你的用户名或密码错误！");
                   }

               }
           });
    });

$("#btn2").click(function(){
$.ajax({
type:"POST",
url:"/JobSite0/test_c",
data:{"tel":$$("tel").value,"psw":$$("psw").value},
success:function(result){
if(result=="true"){
location.replace("/JobSite0/company");
}else{
alert("你的用户名或密码错误！");
}

           }
       });
});
    这段代码应该移动到$("#btn1").click的外部吧。。。。

       }
   });

});
这段代码应该移动到$("#btn1").click的外部吧。。。。

没有jQuery入口函数

$只是jQuery的对象，$(function () {
// 将两个click事件代码写入这里面
});

问题已解决：
1,、jsp中对脚本login.js的引用放到

问题已解决：
1、jsp中对脚本login.js的引用放到

jsp中对脚本login.js的引用放到

应该是事件添加时，button还没完全加载

可能你的按钮被其他标签覆盖了，把按钮单独提出来建一个div试试

问题原因：login.js的加载在创建dom之前，页面中你的$('#btn1')应该是获取不到对象的
解决方法：将login.js移到后面

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Login Page</title>
<style type="text/css">@IMPORT url("css/m.css");</style>
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>

</head>
<body>
<br><br><br><br>
<div class="back">
  <div> 
    <fieldset>
      <legend>JobSite</legend>
      <div class="content">
      <p>
       <label for="tel">手机号码：</label>
       <input type="text" id="tel" name="tel" tabindex="1">
      </p>
      <p>
       <label for="psw">你的密码：</label>
       <input type="password" id="psw" name="psw" tabindex="2">
      </p>
       <a href="/JobSite0/index.html" >返回主页面</a>
       <a href="forget" title="Forget password">忘记密码</a>
      <p>
        <input type="button" tabindex="4" value="学生登录" id="btn1">
        <input type="button" tabindex="5" value="公司登录" id="btn2">
      </p>
      </div>
    </fieldset>  
</div> 
</div>
<script type="text/javascript" src="js/login.js"></script>
</body>
</html>

有两种解决方法：JS文件引用放到页面底部、JS代码放到$(function(){})中

1.JS文件引用放到页面底部

JobSite

手机号码：

你的密码：

返回主页面忘记密码

2.JS代码放到$(function(){})中

$(function(){

function $$(id){
  return document.getElementById(id);
 }

$("#btn1").click(function(){
      alert("学生的登录");
      $.ajax({
           type:"POST",
           url:"/JobSite0/test",
           data:{"tel":$$("tel").value,"psw":$$("psw").value},
           success:function(result){
               if(result=="true"){
                   location.replace("http://localhost:8888/JobSite0/student");
               }else{
                   alert("你的用户名或密码错误！");
               }  
           }
       });
        });

  $("#btn2").click(function(){
      $.ajax({
           type:"POST",
           url:"/JobSite0/test_c",
           data:{"tel":$$("tel").value,"psw":$$("psw").value},
           success:function(result){
               if(result=="true"){
                   location.replace("/JobSite0/company");
               }else{
                   alert("你的用户名或密码错误！");
               }

           }
       });
});

})