已解决：Javascript中的流浪}。 Eclipse IDE在JSP中不检查这些内容。
我无法在JSP中调用我的Javascript函数。我在上面评论过哪些功能正在运行而且无法正常工作。我的目标是根据传递的参数预先选择下拉框。
<script type="text/javascript">
//this alert not working
alert('alert1');
function preloadDropdownBoxes() {
//preload function alert not calling
alert('preload function called');
//mapping vars to java variables
var sYear = '<%=sYear%>';
var collectionPeriod = '<%=collectionPeriod%>';
var submission = '<%=submission%>';
var availDate = '<%=availDate%>';
var openDate = '<%=openDate%>';
var closeDate = '<%=closeDate%>';
//these are time generated values based on calendar instance
var pastTwoYear = '<%=pastTwoYear%>';
var pastYear = '<%=pastYear%>';
var currentYear = '<%=currentYear%>';
var futureYear = '<%=futureYear%>';
//change selectedIndex values if dropdown in JSP has "pastTwoYear"
if (sYear == pastTwoYear) {
document.getElementById('pastTwoYear').selectedIndex = 0;
} else if (sYear == pastYear) {
document.getElementById('past').selectedIndex = 0;
alert(sYear + '0');
} else if (sYear == currentYear) {
document.getElementById('current').selectedIndex = 1;
alert(sYear + '1');
} else if (sYear == futureYear) {
document.getElementById('future').selectedIndex = 2;
alert(sYear + '2');
} else if(sYear == futureTwoYear) {
document.getElementById('futureTwoYear').selectedIndex = 3;
alert(sYear + '3');
}
} //end preLoadDropdownBoxes()
</script>
然后我有我的下拉框的代码。这是一个片段：
<select name="sYear1" id="sYear1" onchange="javascript:PreselectMyItem();">
<option value="past"><%=cal.get(java.util.Calendar.YEAR)-2%>-<%=cal.get(java.util.Calendar.YEAR)-1%></option>
<option value="current"><%=cal.get(java.util.Calendar.YEAR)-1%>-<%=cal.get(java.util.Calendar.YEAR)%></option>
<option value="future"><%=cal.get(java.util.Calendar.YEAR)%>-<%=cal.get(java.util.Calendar.YEAR)+1%></option>
</select>
现在，最后，我在底部有另一个脚本。我计划在最后放置preloadDropdownBoxes();功能。我尝试使用$(document).ready，但它没有用。代码如下：
<script>
// these two alert calls work
alert('footer');
alert('footer next');
// these functions aren't being called
window.preloadDropdownBoxes();
document.getElementById('future').selectedIndex = 2;
window.alert('document ready on bottom');
</script>
</body>
</html>
非常感谢任何帮助！
编辑：我按照以下<input type="button" value="test" onclick="javascript:alert('test');"/>制作了我的测试按钮，此警报确实有效。由于我尝试过，因此文档无法在我的脚本中注册函数似乎有问题
功能测试（） {
警报（ '你好'）;
}
但是当按钮为：<input type="button" value="test" onclick="javascript:test();"/>
答案 0 :(得分：2)
这里有两个问题
}（评论末尾的</head>标记正上方futureTwoYear。您可能需要定义var futureTwoYear= '2014-2015'; 代码：
<html>
<head>
<title>Edit Calendar</title>
<link href="/SpringApp6/css/style.css" rel="stylesheet" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="/SpringApp6/js/tsds_new.js"></script>
<script type="text/javascript" src="/SpringApp6/js/datetimepicker.js"></script>
<!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> -->
<script type="text/javascript">
//this alert not working
alert('alert1');
function selectAll() {
var cancelElements = new Array();
cancelElements = document.getElementsByName("cancel");
if (cancelElements[0].checked == true) {
for (i = 1; i < cancelElements.length; i++) {
if (cancelElements[i].disabled != true
&& cancelElements[i].checked != true) {
cancelElements[i].checked = true;
}
}
} else if(cancelElements[0].checked != true){
for (j = 1; j < cancelElements.length; j++) {
if (cancelElements[j].disabled != true
&& cancelElements[j].checked == true) {
cancelElements[j].checked = false;
}
}
}
}
function passDetails(campus,timestamp, jobname) {
var camp = document.getElementById(campus).innerText;
var tstamp = document.getElementById(timestamp).innerText;
var jname = document.getElementById(jobname).innerText;
window.location.href = "scheduleLoad.jsp?campus="+camp+"×tamp="
+ tstamp + "&jobName=" + jname;
}
function checkSelectAll(){
var cancelElements = new Array();
cancelElements = document.getElementsByName("cancel");
var selectAll=true;
for (j = 1; j < cancelElements.length; j++) {
if (cancelElements[j].disabled != true
&& cancelElements[j].checked != true) {
selectAll=false;
break;
}
}
if(selectAll==true){
cancelElements[0].checked=true;
}else{
cancelElements[0].checked=false;
}
}
/* Reset collection calendar search dropdown boxes */
function resetSearch() {
document.getElementById('sYear').selectedIndex = 0;
document.getElementById('collectionPeriod').selectedIndex = 0;
document.getElementById('submission').selectedIndex = 0;
}
//preselect dropdown based on URL parameter
function preloadDropdownBoxes() {
//preload function alert not calling
alert('preload function called');
//mapping vars to java variables
var sYear = 'past';
var collectionPeriod = 'FALL1';
var submission = 'First';
var availDate = '2013-01-30';
var openDate = '2013-01-30';
var closeDate = '2013-01-30';
//these are time generated values based on calendar instance
var pastTwoYear = '2010-2011';
var pastYear = '2011-2012';
var currentYear = '2012-2013';
var futureYear = '2013-2014';
var futureTwoYear = '2014-2015';
//change selectedIndex values if dropdown in JSP has "pastTwoYear"
if (sYear == pastTwoYear) {
document.getElementById('pastTwoYear').selectedIndex = 0;
} else if (sYear == pastYear) {
document.getElementById('past').selectedIndex = 0;
alert(sYear + '0');
} else if (sYear == currentYear) {
document.getElementById('current').selectedIndex = 1;
alert(sYear + '1');
} else if (sYear == futureYear) {
document.getElementById('future').selectedIndex = 2;
alert(sYear + '2');
} else if(sYear == futureTwoYear) {
document.getElementById('futureTwoYear').selectedIndex = 3;
alert(sYear + '3');
}
} //end preLoadDropdownBoxes()
function test() {
alert('yolo');
}
// alert(document.editCalendarForm1.sYear1.options.length);
// // Get a reference to the drop-down
// var myDropdownList = document.editCalendarForm1.sYear1;
// int iLoop = 0;
// alert(myDropdownList.options.length);
// // Loop through all the items
// for ( iLoop; iLoop< myDropdownList.options.length; iLoop++)
// {
// alert(myDropdownList.options[iLoop].value);
// if (myDropdownList.options[iLoop].value == abc)
// {
// // Item is found. Set its selected property, and exit the loop
// sYear1.options[iLoop].selected = true;
// break;
// }
// }
}
</script>
</head>
<body>
<!-- onload="javascript:openMail();" -->
<table class="maintable" align="center">
<tbody>
<!-- header -->
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PEIMS</title>
<link href="/SpringApp6/css/style.css" rel="stylesheet" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>
<div id="wrapper">
<div id="logoplaceholder">
<div id="logo"> <img src="images/tsdslogo.png" width="287" height="88" alt="tsds logo" /> </div>
<!-- <div id="search"><input id="input" type="text"/><img src="images/Search.png" width="87" height="23"/>
</div> -->
</div>
<div style="text-align: right;">
</div>
<div id="topbar">
<div id="topbarcontent" style="margin-left:30px; border-right: solid 0px; margin-right:30px;">
<b>Jonathan Washington</b> jwashington@washingtonheightsisd.com </div>
<div id="topbarcontent"> My Messages (10)</div>
<div id="topbarcontent"> Help Desk </div>
<div id="topbarcontent"> Exit </div>
<div style="float: left; margin: 13px 5px 5px 5px;"><select>
<option>Washington Heights ISD</option>
<option>Austin ISD</option>
<option>Dallas ISD</option>
<option>Houston ISD</option>
</select></div>
<div id="topbarcontent"
style="border-left: solid thin; border-right: none; border-color: #00A1DE"><img src="/SpringApp6/images/change.png" width="87" height="23" /></div>
</div>
</div>
</div>
</html>
<!-- end header -->
<!-- body -->
<tr height="81%" style="vertical-align: middle;">
<!-- left navigation -->
<td width="20%"><html>
<!-- <style>
.a {text-decoration:none}
</style> -->
<script type="text/javascript">
var context='/SpringApp6';
document.write("<div id=\"leftNav\">");
document.write("<div id=\"leftNavtext\"><a href=\"home.htm\" id=\"phome\" style=\"text-decoration:none\">Home</a></div>");
document.write("<div id=\"leftNavtext\" ><a href=\"dataSubmissions.jsp\" id=\"dataSubmissions\" style=\"text-decoration:none\">Data Submissions</a></div>");
document.write("<div id=\"leftNavtext\" >Data Mart Loads</div>");
/* document.write("<span id=\"listLoads\" style=\"display: none; padding-left: 20px;padding-top:5px;\">");
*/ document.write("<div style=\" padding-left: 20px;padding-top:5px;\" ><a href=\"scheduleLoad.htm\" id=\"scheduleLoad\" style=\"text-decoration:none\">Manage Data Loads</a><br/></div>");
document.write("<div style=\" padding-left: 20px;padding-top:5px;\"><a href=\"scheduleMonitor.htm\" id=\"scheduleMonitor\" style=\"text-decoration:none\">Monitor Data Loads</a></div>");
/* document.write("</span>"); */
document.write("<div id=\"leftNavtext\" ><a href=\"collectionMonitor.htm\" id=\"collectionMonitor\" style=\"text-decoration:none\">Collection Status Monitor</a></div>");
document.write("<div id=\"leftNavtext\">Administration</div>");
/* document.write("<span id=\"listAdminTasks\" style=\"display: none; padding-left: 20px;padding-top:5px;\">"); */
document.write("<div style=\" padding-left: 20px;padding-top:5px;\" ><a href=\"collectionCalendar.htm\" id=\"collCalendar\" style=\"text-decoration:none\">Collection Calendar</a><br/></div>");
//document.write("<a href=\"viewCalendar.jsp\" id=\"viewCalendar\">View Calendar</a><br/>");
document.write("<div style=\" padding-left: 20px;padding-top:5px;\" ><a href=\"extnRequest.jsp\" id=\"extnReq\" style=\"text-decoration:none\">Request Extension</a><br/></div>");
document.write("<div style=\" padding-left: 20px;padding-top:5px;\" ><a href=\"extnApproval.jsp\" id=\"extnApproval\" style=\"text-decoration:none\"> Approve Extensions</a><br/></div>");
document.write("<div style=\" padding-left: 20px;padding-top:5px;\" ><a href=\"configureNotifications.jsp\" id=\"configNotifications\" style=\"text-decoration:none\">Configure Notifications</a></div>");
/* document.write("</span></div>"); */
/* document.write("<div id=\"leftNavtext\"><a href=\"#\" style=\"text-decoration:none\">Data Access</a></div>"); */
document.write("<div id=\"leftNavtext\">Data Access</div>");
/* document.write("<span id=\"listDataTasks\" style=\"display: none; padding-left: 20px;padding-top:5px;\">"); */
document.write("<div style=\" padding-left: 20px;padding-top:5px;\" ><a href=\"dataSearch.jsp\" id=\"dataSearch\" style=\"text-decoration:none\">Data Search</a><br/></div>");
//document.write("<a href=\"viewCalendar.jsp\" id=\"viewCalendar\">View Calendar</a><br/>");
document.write("<div style=\" padding-left: 20px;padding-top:5px;\" ><a href=\"rosterSearch.jsp\" id=\"rosterSearch\" style=\"text-decoration:none\">Roster Search</a><br/></div>");
/* document.write("</span></div>"); */
//document.write("<div style=\"padding-bottom: 20px;\"><a href=\"dataSearch.jsp\" id=\"dataSearch\">Data Search</a></div>");
//document.write("<div style=\"padding-bottom: 20px;\"><a href=\"rosterSearch.jsp\" id=\"rosterSearch\">Roster Search</a></div>");
document.write("</div>");
var loc=location.href;
</script>
<!-- <div style="padding-bottom: 120px;"></div> -->
</html></td>
<!-- end left navigation -->
<!-- main content -->
<td width="55%" style="vertical-align: top;">
<div
style="font-family: sans-serif; padding-bottom: 15px; color: #0099CC;">
Administration >> Collection Calendar >> <b>Edit Collection Calendar</b></div>
<div style="padding-bottom: 20px;">
<h3>Edit Collection Calendar</h3>
</div>
<!-- BEGIN EDIT FORM -->
<form id="editCalendarForm1" action="/SpringApp6/editCalendar.htm?collKey=1&sYear=past&collectionPeriod=FALL1&submission=First&availDate=2013-01-30&openDate=2013-01-30&closeDate=2013-01-30" method="POST">
<input type="hidden" name="initLoad" value="rich1"/>
<table style="width: 100%; margin: auto; font: 100%; border: hidden;">
<tr
style="height: 15px; border-bottom-color: transparent; border-bottom-width: 0;">
<td style="text-align: right; border: hidden;"><b>School
Year</b>:</td>
<td style="border: hidden;">
<select name="sYear1" id="sYear1" onchange="javascript:PreselectMyItem();">
<option value="past">2011-2012</option>
<option value="current">2012-2013</option>
<option value="future">2013-2014</option>
</select>
</td>
<!-- COLLECTION PERIOD -->
<td style="text-align: right; border: hidden;"><b>Collection</b>:</td>
<td style="border: hidden;">
<select name="collectionPeriod1" id="collectionPeriod1" >
<option value="FALL1" id="FALL1">Collection1(FALL1)</option>
<option value="FALL2" id="FALL2">Collection1(FALL2)</option>
<option value="working1" id="working1">Collection1(Working)</option>
<option value="MDYR1" id="MDYR1">Collection2(MDYR1)</option>
<option value="MDYR2" id="MDYR2">Collection2(MDYR2)</option>
<option value="working2" id="working2" >Collection2(Working)</option>
<option value="SUMR1" id="SUMR1">Collection3(SUMR1)</option>
<option value="SUMR2" id="SUMR2">Collection3(SUMR2)</option>
<option value="working3" id="working3">Collection3(Working)</option>
<option value="EXYR1" id="EXYR1">Collection4(EXYR1)</option>
<option value="EXYR2" id="EXYR2">Collection4(EXYR2)</option>
<option value="working4" id="working4">Collection4(Working)</option>
<option value="DASH1" id="DASH1">Collection5(DASH1)</option>
<option value="DASH2" id="DASH2">Collection5(DASH2)</option>
<option value="working5" id="working5">Collection5(Working)</option>
</select>
</td>
<!-- SUBMISSION -->
<td style="text-align: right; border: hidden;"><b>Submission</b>:</td>
<td colspan="2" style="border: hidden;">
<select name="submission1" id="submission1">
<option>First</option>
<option>Second</option>
<option>Working</option>
</select>
</td>
</tr>
<!-- SELECT DATE -->
<tr style="height: 15px; border-bottom-color: transparent; border-bottom-width: 0;">
<td style="border: hidden;" colspan="3"><b>Available Date:</b>
<input name="availDate1" type="Text" id="availDate1" class="calText" size="25" value="01/30/2013"
readonly="readonly" /> <img src="/SpringApp6/images/cal.gif"
width="16" height="16" border="0" alt="Pick a date"
onclick="javascript:NewCal('availDate','MMddyyyy',false,12);"
align="bottom">
</td>
</tr>
<tr style="height: 15px; border-bottom-color: transparent; border-bottom-width: 0;">
<td style="border: hidden;" colspan="3"><b>Open Date:</b>
<input name="openDate1" type="Text" id="openDate1" class="calText" size="25" value="01/30/2013"
readonly="readonly" /> <img src="/SpringApp6/images/cal.gif"
width="16" height="16" border="0" alt="Pick a date"
onclick="javascript:NewCal('openDate','MMddyyyy',false,12);"
align="bottom">
</td>
</tr>
<tr style="height: 15px; border-bottom-color: transparent; border-bottom-width: 0;">
<td style="border: hidden;" colspan="3"><b>Close Date:</b>
<input name="closeDate1" type="Text" id="closeDate1" class="calText" size="25" value="01/30/2013"
readonly="readonly" /> <img src="/SpringApp6/images/cal.gif"
width="16" height="16" border="0" alt="Pick a date"
onclick="javascript:NewCal('closeDate','MMddyyyy',false,12);"
align="bottom">
<br><br>
<!-- <input type="button" value="Close Window" onclick="javascript:window.close()"> -->
</td>
</tr>
</table>
<input type="submit" value="Submit Collection Edits"/>
<input type="button" value="test" onclick="javascript:alert('hey');"/>
<!-- END EDIT -->
<!-- <table class="gridtable" style="width: 100%">
</table> -->
</form>
<!-- <table style="width: 100%;">
<tr style="height: 20px;"></tr>
</table> -->
</td>
<!--end mainContent-->
</tr>
<!-- footer -->
<!-- footer -->
</tbody>
</table>
<div id="copyright" align="center">
<div id="copyright">
</div>
<script>
// these two alert calls
alert('footer');
alert('footer next');
// these functions aren't
window.preloadDropdownBoxes();
document.getElementById('future').selectedIndex = 2;
window.alert('document ready on bottom');
</script>
</body>
</html>
答案 1 :(得分：1)
我创建了一个HTML请参考下面。它在chrome和IE中工作。所有提醒都正常。
<html>
<head>
<script type="text/javascript">
alert('alert1');
window.preloadDropdownBoxes();
function preloadDropdownBoxes() {
//preload function alert not calling
alert('preload function called');
//mapping vars to java variables
var sYear = '<%=sYear%>';
var collectionPeriod = '<%=collectionPeriod%>';
var submission = '<%=submission%>';
var availDate = '<%=availDate%>';
var openDate = '<%=openDate%>';
var closeDate = '<%=closeDate%>';
//these are time generated values based on calendar instance
var pastTwoYear = '<%=pastTwoYear%>';
var pastYear = '<%=pastYear%>';
var currentYear = '<%=currentYear%>';
var futureYear = '<%=futureYear%>';
//change selectedIndex values if dropdown in JSP has "pastTwoYear"
if (sYear == pastTwoYear) {
document.getElementById('pastTwoYear').selectedIndex = 0;
} else if (sYear == pastYear) {
document.getElementById('past').selectedIndex = 0;
alert(sYear + '0');
} else if (sYear == currentYear) {
document.getElementById('current').selectedIndex = 1;
alert(sYear + '1');
} else if (sYear == futureYear) {
document.getElementById('future').selectedIndex = 2;
alert(sYear + '2');
} else if(sYear == futureTwoYear) {
document.getElementById('futureTwoYear').selectedIndex = 3;
alert(sYear + '3');
}
}
function preselectMyItem(value)
{
alert("Selected value is == "+value);
}
</script>
</head>
<body>
<table>
<tr>
<form action="#" method="GET">
<td>select year</td>
<td><select name="sYear1" id="sYear1" onchange="javascript:preselectMyItem(this.value);">
<option value="past">past</option>
<option value="current">current</option>
<option value="future">future</option>
</select>
</td>
</form>
</tr>
</table>
</body>
</html>
确保运行时jsp页面中没有错误。