I'm trying to run a simple jQuery script to show/hide tooltip boxes. It wouldn't work and wouldn't work, so I added in a test alert() to see if it was running at all. The paths to the .js files are correct and the browser does find them as tested in Chrome. Firebug's console doesn't show any error or warnings. I have no idea why jQuery doesn't appear to be running at all. The code looks like it should all work, with the alert() being pretty hard to screw up.
I note that this file is being run locally with no web server running. This does not appear to make a difference, as it didn't run when I uploaded it to a test location on a server. HTML follows.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Employee IT Access Request Form</title>
<!--jQuery call-->
<script type="text/javascript" src="scripts/jquery-2.1.1.min.js"></script>
<link rel="stylesheet" href="scripts/jquery-ui-1.11.2.redmond/jquery-ui.min.css" />
<script type="text/javascript" src="scripts/jquery-ui-1.11.2.redmond/jquery-ui.min.js"></script>
<!--STYLE SHEET-->
<style>
//MUCH OF STYLE SHEET SNIPPED FOR SPACE
.TXTA_ClearOnClick {
width: 25em;
}
.SectionContainer {
border: 2px groove #00A0C4;
padding: 0.25em;
margin-bottom: 1em;
}
.HelpIcon {
display: inline;
margin-left: 2.5em;
border: 1px black solid;
}
.div_help_container {
}
.div_help {
display: none;
position: relative;
padding-left: 1em;
padding-right: 1em;
float: right;
right: 10%;
width: 45em;
font-size: 12px;
z-index: 2;
border: 1px black solid;
background-color: #CDFAFE;
}
.div_help li {
margin-bottom: 0.25em;
}
</style>
<!--END STYLE SHEET-->
<!--PUT jQuery SCRIPTS HERE-->
<script type="text/javascript">
$(document).ready(function() {
alert("Your jQuery finally works!");
)};
</script>
</head>
<body>
<!--HELP BOX TOOLTIPS SCRIPT-->
<script>
$(document).ready(function() {
$(".HelpIcon").mouseenter(function (helpToggle){
helpToggle.preventDefault();
$window = $(this).attr("helpname");
$('"#"+$window').css("display", block);
});
$(".HelpIcon").mouseleave(function (helpToggle){
helpToggle.preventDefault();
$window = $(this).attr("helpname");
$('"#"+$window').css("display", none);
});
});
</script>
<!--BEGIN FORM-->
<div name="formcontainer" id="formcontainer">
<form name="IT_Request_Form">
<!--HR INFORMATION-->
<div name="HRContainer" id="HRContainer" class="SectionContainer">
<h3>HR Information </h3> <img src="images/helpicon.png" name="IMG_HLP_Basic" id="IMG_HLP_Basic" helpname="HLP_Basic" class="HelpIcon" alt="Hover for help">
<div name="HLP_HR" id="HLP_HR" class="div_help">
<p><strong>HR Information</strong></p>
<ul>
<li><strong>Employee Name</strong> is the name of the employee for whom you are requesting IT assistance.</li>
<li><strong>Effective Date</strong> is the date on which the employee is expected to start.</li>
<li><strong>Requesting Department Head</strong> is the person making the request. IT requests must come through department heads via HR.
<li><strong>Position</strong> is the position the user is entering or leaving or that the user occupies.</li>
<li><strong>Type of status change</strong> described what's going on that you're making this request.
<ul>
<li><em>New Hire:</em> The user is not already employed with RRC.</li>
<li><em>Additional Position:</em> The user is taking a new position while keeping a position that (s)he is already working in.</li>
<li><em>Transfer from existing position:</em> The user is leaving one position to instead work in another.</li>
<li><em>Termination:</em> The user has left employment with RRC entirely.</li>
<li><em>Remove from this position only:</em> The user had more than one position and has left one.</li>
<li><em>Change in access:</em> The user is being promoted or demoted. Alternately, the user is staying in the same position but needs access to something (s)he did not have access to before, such as needing an Oasis login when (s)he didn't need one before. Rather than listing any changes, list all items as though the person were a new employee.</li>
</ul>
</li>
</ol>
</div>
<p><strong>Employee Name:</strong> <input type="text" name="EmployeeName" id="EmployeeName"> <strong>Requesting Department Head:</strong> <input type="text" name="DeptHead" id="DeptHead"></p>
<p><strong>Position:</strong>
<!--SNIPPED FOR SPACE-->`enter code here`
<strong style="margin-left: 2em;">Effective Date:</strong> <input type="date" name="EffectiveDate" id="EffectiveDate"></p>
<p>
<table name="TBL_StatusChange" id="TBL_StatusChange">
<caption>Type of Status Change</caption>
<tr>
<td><input type="radio" value="New Hire" name="StatusChange" id="StatusChange_NH"> New Hire</td>
<td><input type="radio" value="Additional Position" name="StatusChange" id="StatusChange_Add"> Additional position</td>
<td><input type="radio" value="Promotion or Change in Access" name="StatusChange" id="StatusChange_Promo"> Change in access (reset user to what's listed)<br>
<span style="position:relative;left:1em;color:#D00; font-size:12px;">^ use for promotion/demotion or when a user's needs change otherwise</span></td>
</tr>
<tr>
<td><input type="radio" value="Transfer from Existing Position" name="StatusChange" id="StatusChange_Transfer"> Transfer from existing position</td>
<td><input type="radio" value="Termination" name="StatusChange" id="StatusChange_Fired"> Termination</td>
<td><input type="radio" value="Remove from Position" name="StatusChange" id="StatusChange_Remove"> Remove from this position only</td>
</tr>
<tr>
</tr>
</table>
</p>
</div><!--ENDS HR INFORMATION CONTAINER-->
<!--COMPUTING RESOURCES-->
<div name="ResourcesContainer" id="ResourcesContainer" class="SectionContainer">
<h3>IT Resources</h3> <img src="images/helpicon.png" name="IMG_HLP_Resources" id="IMG_HLP_Resources" helpname="HLP_Resources" class="HelpIcon" alt="Hover for help">
<div name="HLP_Resources" id="HLP_Resources" class="div_help">
<p><strong>IT Information</strong></p>
<p>This is where you lay out what specifically IT needs to do for this person.</p>
<ul>
<li><strong>Printers:</strong> Anyone with a user account should be mapped to at least one of the large multifunction printers. State what the user's default printer should be and in the following text box state other printers the user should have access to.</li>
<li><strong>General requirements:</strong>
<ul>
<li><em>Phone:</em> Check the box if the user needs to use his/her own phone. If so, state if there's already a phone at the user's workstation or if a phone needs to be installed. Also check the relevant boxes if the user needs to have a direct number on top of having an extension and/or needs to have a long-distance code.</li>
<li><em>Computer:</em> Check the box if the user needs his/her own computer. If so, select the type of system from the dropdown list and use the radio buttons at right to indicate if there's already a computer at the user's workstation or if one needs to be installed.</li>
<li><em>Email:</em> Check the box if the user needs an email account. Check the additional box if the user would like to get work email on his/her personal phone. Note that doing so requires the user to sign an agreement allowing IT to reset the user's phone to its factory default state if the user leaves employ with RRC/FSST.</li>
<li><em>Virtual Machine:</em> Does the user need Windows XP for something? If so, check the box and use the text area to say why the user needs a Windows XP virtual machine.</li>
<li><em>VPN connection:</em> Does the user need to be able to access his/her system from offsite? If so, check the box and use the text area to explain why. Note that this requires a signed agreement.</li>
<li><em>Other assistance:</em> If the user needs something else from IT, list it here.</li>
</ul>
</ul>
</div>
<p><strong>Primary Multifunction Printer (MFP) Location:</strong>
<!--SNIPPED FOR SPACE-->
</p>
<p><strong>Additional MFPs for user (if any):</strong> <input type="text" name="AdditionalPrinters" id="AdditionalPrinters"></p>
<p>
<table name="TBL_GeneralNeeds" id="TBL_GeneralNeeds">
<caption>The user requires the following:</caption>
<tr>
<td><input type="checkbox" name="CHK_Phone" id="CHK_Phone" value="Phone"><strong>Phone</strong><br>
<input type="radio" name="NewPhone" id="NewPhone" value="Needs new phone"> New phone needed
<input type="radio" name="NewPhone" id="NewPhone" value="Phone is already present">Phone already present
</td>
<td><input type="checkbox" name="CHK_DID" id="CHK_DID" value="Direct-In Dial">Direct-In Dial<br>
<input type="checkbox" name="CHK_LDCode" id="CHK_LDCode" value="Long-Distance Code">Long-Distance Code</td>
</tr>
<tr>
<td><input type="checkbox" name="CHK_" id="CHK_" value=""><strong style="margin-right: 1em;">Computer</strong> type:
<select>
<option value=""></option>
<option value="Desktop">Desktop</option>
<option value="Laptop">Laptop</option>
<option value="Thin Client">Thin Client</option>
</select>
</td>
<td>
<input type="radio" name="NewComputer" id="NewComputer" value="Needs new computer"> New
<input type="radio" name="NewComputer" id="NewComputer" value="Computer is already present">Already present
</td>
</tr>
<tr>
<td><input type="checkbox" name="CHK_Email" id="CHK_Email" value="Email"><strong>Email</strong></td>
<td><input type="checkbox" name="CHK_EmailOnPhone" id="CHK_EmailOnPhone" value="Email on phone">on the user's Phone?<br>
<span style="color:#D00;font-size:12px;">* Requires signed agreement</span></td>
</tr>
<tr>
<td><input type="checkbox" name="CHK_VM" id="CHK_VM" value="Virtual Machine"><strong>Virtual Machine</strong></td>
<td name="TD_VMreason" id="TD_VMreason"><textarea name="VMreason" id="VMreason" class="TXTA_ClearOnClick" placeholder="Why does this user need a VM?"></textarea></td>
</tr>
<tr>
<td><input type="checkbox" name="CHK_VPN" id="CHK_VPN" value="VPN access"><strong>VPN access</strong></td>
<td name="TD_VPNreason" id="TD_VPNreason"><textarea name="VPNreason" id="VPNreason" class="TXTA_ClearOnClick" placeholder="Why does this user need a VPN connection?"></textarea><br>
<span style="color:#D00;font-size:12px">* Requires signed agreement</span></td>
</tr>
<tr>
<td>Does the user need any special software?</td>
<td><textarea name="SpecialSoftware" id="SpecialSoftware" class="TXTA_ClearOnClick" placeholder="Oasis, DataPlus, Report Exec, etc."></textarea></td>
</tr>
<tr>
<td>List other assistance the user needs from IT:</td>
<td><textarea name="OtherRequest" id="OtherRequest" class="TXTA_ClearOnClick" placeholder="What else does this user need from IT?"></textarea></td>
</tr>
</table>
<p>
<table name="TBL_Shares" id="TBL_Shares">
<caption>User needs access to the following shared drives:</caption>
<tr>
<td><input type="checkbox" name="CHK_Accounting" id="CHK_Accounting" value="Accounting">Accounting</td>
<td><input type="checkbox" name="CHK_CasinoPolicies" id="CHK_CasinoPolicies" value="Casino Policies">Casino Policies</td>
<td><input type="checkbox" name="CHK_Education" id="CHK_Education" value="Education">Education</td>
<td><input type="checkbox" name="CHK_" id="CHK_" value="Food and Beverage">Food & Beverage</td>
<td><input type="checkbox" name="CHK_" id="CHK_" value="Gift Shop">Gift Shop</td>
</tr>
<tr>
<td><input type="checkbox" name="CHK_GroupSales" id="CHK_GroupSales" value="Group Sales">Group Sales</td>
<td><input type="checkbox" name="CHK_GroupSalesFB" id="CHK_GroupSalesFB" value="">Group Sales F&B</td>
<td><input type="checkbox" name="CHK_Hotel" id="CHK_Hotel" value="Hotel">Hotel</td>
<td><input type="checkbox" name="CHK_HR" id="CHK_HR" value="HR">HR</td>
<td><input type="checkbox" name="CHK_IT" id="CHK_IT" value="IT">IT</td>
</tr>
<tr>
<td><input type="checkbox" name="CHK_Land" id="CHK_Land" value="Land Management">Land Management</td>
<td><input type="checkbox" name="CHK_Marketing" id="CHK_Marketing" value="">Marketing</td>
<td><input type="checkbox" name="CHK_PlayersClub" id="CHK_PlayersClub" value="">Player's Club</td>
<td><input type="checkbox" name="CHK_Porter" id="CHK_Porter" value="Porters">Porter</td>
<td><input type="checkbox" name="CHK_Rooster" id="CHK_Rooster" value="Rooster River">Rooster River</td>
</tr>
<tr>
<td><input type="checkbox" name="CHK_" id="CHK_" value="">Security</td>
<td><input type="checkbox" name="CHK_" id="CHK_" value="">Slots</td>
<td><input type="checkbox" name="CHK_" id="CHK_" value="">Surveillance</td>
<td><input type="checkbox" name="CHK_" id="CHK_" value="">Tribal Office</td>
</tr>
</table>
</p>
</div> <!--ENDS IT RESOURCES CONTAINER-->
<input type="submit" value="Submit form">
</form>
</div>
<!--END FORM-->
</body>
</html>
Your parenthesis is off.
your code:
$(document).ready(function() { alert("Your jQuery finally works!"); )};the right code:
$(document).ready(function() { alert("Your jQuery finally works!"); });The code
is creating a jQuery object that represents the entire page, and the ready function allows you to specify functionality to instantiate upon completed page load. You must make sure the anonymous function you are passing in is declared completely within the parenthesis of the ready function.