JQuery is not working in JSP with Struts2
Question
I have included the JQuery CDN in the <script> tag,but it does not works. I am using intellij, it prompts me WITH such warning "Unresolved function or method $()"
Any response is appreciated
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<script src="http//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.0.min.js"></script>
<title>Success</title>
<script>
$("#select").click(function() {
alert("aaaa");
});
$("#delete").click(function() {
alert("aa");
});
</script>
</head>
<body>
<label for="person">personname</label>
<input id="person" name = "person" type="text" />
<input id="add"type="button" value="add" />
<input id="delete"type="button" value="delete"/>
<input id="select"type="button" value="select"/>
<input id="update"type="button" value="update"/>
</body>
</html>
1 answers
solution1
1 ACCPTED 2016-01-22 03:37:39
Since you have put all js inside header you have to put it inside document.ready .
<script>
$(document).ready(function(){
$("#select").click(function() {
alert("aaaa");
});
$("#delete").click(function() {
alert("aa");
});
})
</script>
This is because script tag is a blocking tag and when you put it inside header tag, it will be parsed before DOM is ready. At that time jQuery don't know what is #select & #delete , so no way it will able to attach the click handler.
A second option is to put all script near closing body tag. So first DOM will be ready with elements then js will be executed. Then you can remove the
$(document).ready(function(){
})
Example
<body>
<!--All HTML elements-->
<script>
// All your js goes here.
</script>
There are several advantage of putting scripts just before closing </body> tag , which is beyond this question
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.