|
JavaScript - Approaching Function Parameters The Wrong Way
Hey there, I started learning Javascript about five weeks ago when I started my University course, and I have been doing above averagely in the little mini-tests, but now I am on coursework I have been having trouble getting past the most simple thing, and I can't help think that I'm just approaching the issue from the wrong angle in my head.
I'm not asking to be spoon-fed the answers from veteran coders or cheating because that just defeats the point of learning. In fact I actively discourage anyone from posting a direct answer to this question. However I would like some assistance in the kind of thinking that would help me in term of creating a function like this; Name of function and parameters: index(string,pattern,caseSensitive) "Where pattern starts in string (or -1 if it is not found), return the index. The search needs to be case sensitive if the third parameter is true else it is case insensitive." (Where underlined and italics are parameter names) I know how to create functions in general, however I cannot get my head around the fact that the parameters are supposed to represent something, and it is required for me to program something without knowing what the parameters represent. I know it's simple and I'm probably thinking about it the wrong way. If anyone could assist me I would be grateful. Similar TutorialsHi, I am making a function that executes code as AJAX readyState's are returned... If readyState = 3 then I running code through eval but I want to be able to run functions with parameters, within the parameter that is evetually executed by the eval Heres abit of pseudo code of what I am talking about Code: function receiveRequest(whileLoading, whenDone) {
// AJAX stuff... blah... blah... blah...
if request is being processed:
eval(whileLoading)
if request is done:
eval(whenDone)
}
// When a button is clicked:
onClick="receiveRequest('alert('loading')', 'alert('finished AJAX request')')"
But this doesn't work because I am escaping the first parameter of 'receiveRequest' in the alert() but if I use double quote (") I will be escaping the event handler Is there anyway to get around this / or a better way to fix it? I haven't used Javascript in agggeeesss and I can barely remember anything anymore - PHP <3 Thanks in advanced. I am to make a showresults function, purpose is for results 4 parameters are in function, race, name,party and votes i then declare variable named totalV equal to value of returned by the totalVotes() function useing votes as parameter value then write HTML code to document this is the code I came up with Code: function showResults(race,name,party,votes)
{ // script element to display the results of a particular race
var totalV = totalVotes(votes);
document.write("<h2>" + race + "</h2>");
document.write("<table cellspacing='0'>");
document.write("<tr>");
document.write("<th>Candidate</th>");
document.write("<th class ='num'>Votes</th>");
document.write("<th class='num'>%</th>");
document.write("</tr>");
}
How does this look so far? I'm probably missing something simple here. I have this function called display: function display(name3,office3,officePH3,mobile3,email3) { document.getElementById('viewer').src=('Location_Files/')+(office3)+('.htm') } It's supposed to take 5 values and do various things with them. When I only had one parameter it worked fine, it took an office number which was the value of a listbox option and turned it into a path and then pointed an iframe to that path. Then I changed it so the value of the listbox option was 5 parameters separated by commas. Here's the listbox now: <select onchange="display(this.value)" multiple="multiple" id="People" name="People" style="border-style: none; height:260px; width:220px;"> <option value="test name,1656,phone,NONE,email">Loading</option> </select> You can see display is executed as "display(this.value)" so in theory it should take "test name,1656,phone,NONE,email" as its parameters and it should accept 1656 as the "office3" parameter. For some reason it's not working out that way, the function executes and the iframe changes but I get an unable to display webpage message like the path is broken. Can anyone see what I'm doing wrong? I wrote a script that creates 2 absolutely positioned divs, in perfect alignment, one on top of the other. I want to use javascript to manipulate the display property of each div to show one div at a time by toggling each div's display property between none and block with an onClick event handler attached to the link. This script works fine when the javascript function has no parameters, because the div id's are inserted directly into the getElementById function. When I say it works, I mean the div with id=cal2 displays onload, then disappears when the Show Calendar link is clicked. The div that appears in its place has a link that does the reverse when clicked. I want to create multiple pairs of overlapping divs that toggle their visibility, so I want to put parameters inside the functions that identify the specific pair of divs that need to be toggled per function call. When I try to use variables/parameters in the functions to insert specific div id's into getElementById, it does not work. PLEASE NOTE, the code below has div id's in green that don't have quotes of any kind. It still works in my firefox browser. I thought id's needed quotes, but it works without. I don't know why. The code below works, but has no parameters in the functions: Code: <!DOCTYPE html>
<xhtml>
<head>
<title>Practice Calendar</title>
<style type="text/css">
.practicecalendar
{
position: absolute;
top: 0px;
left: 0px;
margin: 0;
width: 18em;
background: #B3FF99;
text-align: center;
}
.practiceschedule
{
position: absolute;
top: 0px;
left: 0px;
margin: 0;
width: 18em;
background: #99E6FF;
text-align: center;
}
</style>
<script type="text/javascript">
<!--
function showSchedule(){
document.getElementById('sch2').style.display = 'block';
document.getElementById('cal2').style.display = 'none';
}
function showCalendar(){
document.getElementById('cal2').style.display = 'block';
document.getElementById('sch2').style.display = 'none';
}
//-->
</script>
</head>
<body>
<div id= cal2 class='practicecalendar' style='
display: block;
'>
<p>Calendar</p>
<p><a href='' onClick='showSchedule(); return false'>Show Schedule</a></p>
</div>
<div id= sch2 class='practiceschedule' style='
display: none;
'>
<p>Schedule</p>
<p><a href='' onClick='showCalendar(); return false'>Show Calendar</a></p>
</div>
</body>
</xhtml>
When I add the information in red to the same script above, I get the script below that does not work. Code: <!DOCTYPE html>
<xhtml>
<head>
<title>Practice Calendar</title>
<style type="text/css">
.practicecalendar
{
position: absolute;
top: 0px;
left: 0px;
margin: 0;
width: 18em;
background: #B3FF99;
text-align: center;
}
.practiceschedule
{
position: absolute;
top: 0px;
left: 0px;
margin: 0;
width: 18em;
background: #99E6FF;
text-align: center;
}
</style>
<script type="text/javascript">
<!--
function showSchedule( sch,cal ){
document.getElementById( 'sch' ).style.display = 'block';
document.getElementById( 'cal' ).style.display = 'none';
}
function showCalendar( cal,sch ){
document.getElementById( 'cal' ).style.display = 'block';
document.getElementById( 'sch' ).style.display = 'none';
}
//-->
</script>
</head>
<body>
<div id= cal2 class='practicecalendar' style='
display: block;
'>
<p>Calendar</p>
<p><a href='' onClick='showSchedule( 'sch2','cal2' ); return false'>Show Schedule</a></p>
</div>
<div id= sch2 class='practiceschedule' style='
display: none;
'>
<p>Schedule</p>
<p><a href='' onClick='showCalendar( 'cal2','sch2' ); return false'>Show Calendar</a></p>
</div>
</body>
</xhtml>
When I remove the single quotes from the blue code , it does not work either. Code: <!DOCTYPE html>
<xhtml>
<head>
<title>Practice Calendar</title>
<style type="text/css">
.practicecalendar
{
position: absolute;
top: 0px;
left: 0px;
margin: 0;
width: 18em;
background: #B3FF99;
text-align: center;
}
.practiceschedule
{
position: absolute;
top: 0px;
left: 0px;
margin: 0;
width: 18em;
background: #99E6FF;
text-align: center;
}
</style>
<script type="text/javascript">
<!--
function showSchedule(sch,cal){
document.getElementById('sch').style.display = 'block';
document.getElementById('cal').style.display = 'none';
}
function showCalendar(cal,sch){
document.getElementById('cal').style.display = 'block';
document.getElementById('sch').style.display = 'none';
}
//-->
</script>
</head>
<body>
<div id=cal2 class='practicecalendar' style='
display: block;
'>
<p>Calendar</p>
<p><a href='' onClick='showSchedule( sch2,cal2 ); return false'>Show Schedule</a></p>
</div>
<div id=sch2 class='practiceschedule' style='
display: none;
'>
<p>Schedule</p>
<p><a href='' onClick='showCalendar( cal2,sch2 ); return false'>Show Calendar</a></p>
</div>
</body>
</xhtml>
Thanks for reading all of this. Does anyone know what I'm missing? I put the following line in the onchange tag of a listbox to use the values to manipulate an iframe: document.getElementById('viewer').src=('Location_Files/')+(this.value)+('.htm') There it works perfectly but I wanted to do more so I decided to build a function around it: function display() { document.getElementById('viewer').src=('Location_Files/')+(this.value)+('.htm') } When I put the function in the onchange tag instead, the iframe tries to work but I get a "can't load page" message like the src is broken. Now when I first made that line it took me hours to figure out that I can't use a "\" because if I do it fails. So I went with "/" and that works but I wonder if that rules change when I specify it in the java script instead of in the onchange tag itself. Either way it still breaks if I try to use "\". Does anyone see the problem? I can't get the function getchecked() to show an alert box... Code: <script>
function getCheckedValue(radioObj) {
if(!radioObj){
return "";
}
var radioLength = radioObj.length;
if(radioLength == undefined){
if(radioObj.checked){
return radioObj.value;
}else{
return "";
}
}
for(var i = 0; i < radioLength; i++) {
if(radioObj[i].checked) {
return radioObj[i].value;
}
}
return "";
}
}
function getchecked(){
var thecode=getCheckedValue(document.forms['radioExampleForm'].elements['code']);
if(thecode!==""){
if(thecode=="HTML"){
alert('Checked value is: '+thecode+'.');
//playSound("test1.mp3");
}else if(thecode=="PHP"){
//playSound("test2.mp3");
alert('Checked value is: '+thecode+'.');
}else{
//playSound("test3.mp3");
alert('Checked value is: nothing');
}
}
}
</script>
<label for="code1"><input type="radio" value="HTML" name="code" id="code1"> HTML</label>
<br><label for="code2"><input type="radio" value="PHP" name="code" id="code2"> PHP</label>
<br><label for="code3"><input type="radio" value="MySQL" name="code" id="code3"> MySQL</label>
<br><input type="button" onclick="getchecked()" value="Show Checked Value">
thanks! I need some help on my math equation, I got the calculations and confirm.submit, and the alert messages to all work properly, but when I go to put the data into the math equation, I am coming up with some outrageous number way off from what it is supposed to be. What I am trying to accomplish is to take the calculated number of day and hours and minutes; multiply the total time in hours by the equipment cost per hour and calculate the total amount of rent. My problem I think is in the calculate total amount of rent section in the script. Please help, your expertise is greatly appreciated. Below is the math equation in the script section: Code: //calculate days from date field
function checkit() {
var today = new Date();
var nowyear = today.getFullYear();
var d1 = document.forms[0].pickupDate.value.split("/");
var yr = d1[2];
var mm = d1[0]-1;
var dy = d1[1];
var OK1 = checkValidDate(yr,mm,dy);
if ((yr < nowyear || yr > nowyear +1)) {OK1 = false} // only valid for current year and next year
var d2 = document.forms[0].returnDate.value.split("/");
yr = d2[2];
mm = d2[0]-1;
dy = d2[1];
var OK2 = checkValidDate(yr,mm,dy);
if ((yr < nowyear || yr > nowyear+2)) {OK2 = false}
if ((!OK1) || (!OK2)) {
alert ("Invalid dates\(s\) or incorrect format! Please try again.");
document.forms[0].pickupDate.value = "";
document.forms[0].returnDate.value = "";
return false;
}
// arbitrary or example start and end times obtained from elsewhere (select lists)
var fhrs = parseFloat(document.forms[0].pickupHours.value);
var fmins = parseFloat(document.forms[0].pickupMinutes.value);
var shrs = parseFloat(document.forms[0].returnHours.value);
var smins = parseFloat(document.forms[0].returnMinutes.value);
var firstDate = new Date(d1[2],d1[0]-1,d1[1],fhrs,fmins); // note month must be 0-11!! Also note USA date format
var secondDate = new Date(d2[2],d2[0]-1,d2[1],shrs,smins);
var difference = secondDate.getTime() - firstDate.getTime();
var secs = difference/1000;
var days = Math.floor(secs/86400);
secs %= 86400;
var hours= Math.floor(secs/3600);
if (hours<10) {hours = "0" + hours}
secs %= 3600;
var mins = Math.floor(secs/60);
if (mins<10) {mins = "0" + mins}
alert ("Time Difference is " + days + " Days " + hours + " Hours " + mins + " Minutes");
//calculate total amount of rent
var equip = parseFloat(document.forms[0].equipment.value);
var total = (((days * 24) + hours + mins) * equip);
var OK = window.confirm(" The total rental cost is $" + total + "\n Click OK to accept, Cancel to decline");
if (OK) {return true}
else {return false}
}
function checkValidDate(yr,mm,dy) {
var nd = new Date();
nd.setFullYear(yr,mm,dy); // YYYY,MM(0-11),DD
var ndmm = nd.getMonth();
if (ndmm != mm) {
return false;
}
else {
return true;
}
}
This is the form in the body section: Code: <form onsubmit = "return validateForm()" action = "mailto:rogalskibf@gmail.com?subject=ABC Customer Reservation" method="post" enctype="text/plain">
<table border = "0">
<tr>
<td>
Equipment:<br/>
<select name = "equipment">
<option value="unselected">Select Equipment Type</option>
<option value = 20>Fishing Boat</option>
<option value = 15>Kayak</option>
<option value = 2>Mountain Bike</option>
<option value = 10>Scuba Gear</option>
</select>
</td>
</tr>
<tr>
<td>
Pick-up Date: <br/>
<input type = "text" id = "dateIn" name = "pickupDate" id = "date1" onchange = checkValidPDate(this.value)>
</td>
<td>
Pick-up Time: <br/>
<select name = "pickupHours">
<option value="unselected">hr</option>
<option value = 7>07</option>
<option value = 8>08</option>
<option value = 9>09</option>
<option value = 10>10</option>
<option value = 11>11</option>
<option value = 12>12</option>
<option value = 13>13</option>
<option value = 14>14</option>
<option value = 15>15</option>
<option value = 16>16</option>
<option value = 17>17</option>
</select>
<select name = "pickupMinutes">
<option value="unselected">min</option>
<option value = 0>00</option>
<option value = .5>30</option>
</select>
</td>
</tr>
<tr>
<td>
Return Date: <br/>
<input type = "text" id = "dateOut" name = "returnDate" id = "date2" onchange = checkValidRDate(this.value)>
</td>
<td>
Return Time: <br/>
<select name = "returnHours">
<option value="unselected">hr</option>
<option value = 7>07</option>
<option value = 8>08</option>
<option value = 9>09</option>
<option value = 10>10</option>
<option value = 11>11</option>
<option value = 12>12</option>
<option value = 13>13</option>
<option value = 14>14</option>
<option value = 15>15</option>
<option value = 16>16</option>
<option value = 17>17</option>
</select>
<select name = "returnMinutes">
<option value="unselected">min</option>
<option value = 0>00</option>
<option value = .5>30</option>
</select>
</td>
</tr>
<tr>
<td>
First Name: <br/>
<input type = "text" name = "firstName"/>
</td>
<td>
Last Name: <br/>
<input type = "text" name = "lastName"/>
</td>
</tr>
<tr>
<td>
Street: <br/>
<input type = "text" name = "street"/>
</td>
<td>
City: <br/>
<input type = "text" name = "city"/>
</td>
<td>
Zip:<br/>
<input type = "text" name = "zip" maxlength = "5"/>
</td>
</tr>
<tr>
<td>
Date of Birth: <br/>
<input type="text" name="date" onblur="checkAge(this.value)" />
</td>
</tr>
<tr>
<td colspan = "3" align = "center">
<input type = "submit" name = "submit" value = "Submit Reservation" onclick = "return checkit()"/>
<input type = "button" value = 'Set Cookies' onclick = "setCookie('anyName', cookieValue ,expDate)">
<input type = "button" value = 'Display Cookies' onclick = "dispCookie('anyName')">
</td>
</tr>
</table>
</form>
So I want this function to return the date in the format: 4-Jan-2011. I feel like I have to make the variables strings or something but I can't figure it out, I'm kinda new to javascript. Code: function calander(TheDay) {
var theDate = new Date();
var day = new theDate.getDay();
var month = new theDate.getMonth();
var year = new theDate.getFullYear();
if (month == 0) {month = "Jan";}if (month == 1) { month = "Feb"; }
if (month == 2) { month = "March"; }if (month == 3) { month = "April"; }
if (month == 4) { month = "May"; }if (month == 5) { month = "June"; }
if (month == 6) { month = "July"; }if (month == 7) { month = "Aug"; }
if (month == 8) { month = "Sept"; }if (month == 9) { month = "Oct"; }
if (month == 10) { month = "Nov"; }if (month == 11) { month = "Dec"; }
TheDay.value = day + "-" + month + "-" + year;
}
HTML CODE BELOW (JAVASCRIPT CODE FOLLOWS); Code: <!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Text Object value Property</title>
<script type="text/javascript" src="../jsb-global.js"></script>
<script type="text/javascript" src="jsb-11-02.js"></script>
</head>
<body>
<h1>Text Object value Property</h1>
<form id="UCform" action="make-uppercase.php">
<p>
<input type="text" id="converter" name="converter" value="sample">
</p>
</form>
</body>
</html>
This program below switches what is entered into the text filed to caps when hitting the enter button or the tab button. Can someone explain to me why it is not working. The answer would be helpful to a newbie who's trying hard to learn the fundamentals... Code: // initialize when the page has loaded
window.onload = initialize;
var oInput; // (global) input field to make uppercase
// apply behaviors when document has loaded
function initialize()
{
// do this only if the browser can handle DOM methods
if (document.getElementById)
{
// apply event handler to the button
oInput = document.getElementById('converter');
if (oInput){
var event = oInput.onchange;
upperMe(event);
}
// apply event handler to the form
var oForm = document.getElementById('UCform');
if (oForm)
{
var event = oForm.onsubmit;
upperMe(event);
}
}
}
// make the text UPPERCASE
function upperMe(evt)
{ // consolidate event handling
if (!evt) evt = window.event;
// set input field value to the uppercase version of itself
var sUpperCaseValue = oInput.value.toUpperCase();
oInput.value = sUpperCaseValue;
// cancel default behavior (esp. form submission)
// W3C DOM method (hide from IE)
if (evt.preventDefault) evt.preventDefault();
// IE method
return false;
}
Hi, I am doing a Validation for Form "Text input". If the user leaves the input empty, a function is starting to run. If the field is bigger than 1 - so it doesn't get into the function. The problem is: The first time, the user left the input empty, function ran, and I got the alert - that's OK. Second time, The user added 10 in the AGE input - And again he gets the Alert - But he should not. Note: Age input value, returns from a different function (calc) to a var called: result. this is the code: Code: $(document).ready(function(){
$('#btn_send').click(function(){
//var result gets the value from another function of input "Age" value. -> return thisform.Age.value
var result = calc(document.getElementById("campaignform"));
if (result<1)
{
$("#campaignform").submit(function(event) {
event.preventDefault(); alert ("prevent default");
});
}
else{
return true;
};
});
});
so if you try the second time to click on Submit, then you get into $('#btn_send').click(function() and eventhough you added for example 67 in the AGE (return as result) input, you get into the IF statement which is: if (result<1) I'm pretty new to developing, so I hop you will understand me. Sorry if I have mistakes. Can you advice what could be a better TITLE for this question? thanks in advance, Shai Hi, Could I stablish parameters to .html or .asp (principally) dealing with width, height, color, etc. like this? Quote: <ASP:FILE ID = "oApp" APPLICATIONNAME = "Drive coll and obj" BORDER = "thin" CAPTION = "yes" ICON = "/images/book.ico" SHOWINTASKBAR = "yes" SINGLEINSTANCE = "yes" SYSMENU = "yes" WINDOWSTATE = "maximize" SCROLL = "yes" SCROLLFLAT = "yes" VERSION = "1.0" INNERBORDER = "yes" SELECTION = "yes" MAXIMIZEBUTTON = "yes" MINIMIZEBUTTON = "yes" NAVIGABLE = "yes" CONTEXTMENU = "yes" BORDERSTYLE = "normal" > Best for now just he! Hello, I have a question. If I include js like this: <script type="text/javascript" src="code.js?ver=1"></script> If this include makes browser to always download js script? or does he use script from catch? I need this for changing ver number for browser to know when to redownload script. maybe is other way to redownload js script just when js script content is changed? P.S. Sorry for my bad english. (I hope you understand what I wanted to ask) Regards, sAdFella i m trying to implement captcha in my site.i m using recaptcha. To check the captcha i need to request url like: http://www.google.com/recaptcha/api/verify?privatekey="key"&remoteip="ip"&challenge="chal"&response="res" and then i need to check response from url if it is true or false i dont know how to request response from url help plz Code: function viewDetails(rowid,linkid){
alert("enterining into bundles");
if(linkid=='seobundles')
{
alert("enetering into if ");
document.chwAnnouncementW.action='${contextPath}'+"/dolphin.wss/viewSeobundleW?rowindex="+rowid;
document.chwAnnouncementW.submit();
}
else
{
alert(linkid);
document.chwAnnouncementW.action='${contextPath}'+"/dolphin.wss/viewSeoW?rowindex="+rowid;
document.chwAnnouncementW.submit();
}
}
Actually i am passing linkid="seobundles" as string but its not interpreting and it is always going to else part and not if part. I tried to print link id its teling its of object HTML table type and we are passing the two parameters rowid, linkid from a macro. rowid is working fine as and when we select radio buttion but linkid is not working as an string. IF i pur linkid in single quotes then also its not working I need to create a function with named getFontSize() needs one parameter named "id" and id is value of object in document then to create a variable named object to represent object return font size of text in object use style object to retrieve font size and use parseInt() function to get value of font size this is the code i came up with Code: function getFontSize(id) {
// Returns the font size of the object with the value id
var object=document.getElementById(id);
fontsize=parseInt(object.style.fontSize);
return(fontsize);
}
What should i change to make work/ I am working on this simple calculator that passes values from one function to another via paramters. I have used alert() to find what is being recieved, so far nothing. here is my code: Code: <html>
<head>
<title>Rectangle Calculator</title>
<script type="text/javascript">
function calcArea(l,w) {
var area = l * w
return area
alert("area: " + perimeter) // doesnt work
}
function calcPerim(l,w) {
var perimeter = 2*(l+w)
return perimeter
alert("perimeter: " + perimeter) // doesnt work
}
function calc() {
var width
width = document.calcForm.widthBox.value
var length
length = document.calcForm.lengthBox.value
alert(length + width) // works
calcArea(length, width)
document.clacForm.areaBox.value = area
calcPerim(length, width)
document.clacForm.perimeterBox.value = perimeter
}
</script>
</head>
<body>
<p><strong>Area and Perimeter Calculator</strong></p>
<form name="calcForm">
<label>Enter Width of the rectangle:</label> <br />
<input type="text" name="widthBox" size="6" /> <br /><br />
<label>Enter Length of the rectangle:</label> <br />
<input type="text" name="lengthBox" size="6" /> <br />
<input type="button" onClick="calc()" value="calculate" /><br /><br />
<label>The area is:</label> <br />
<input type="text" name="areaBox" size="12" /> <br /><br />
<label>The perimeter is:</label> <br />
<input type="text" name="perimeterBox" size="12" /> <br />
</form>
</body>
</html>
here is the link to my page: http://royalvillicus.com/school/calcdebug.html I appreciate the help Hi, I have a website with several pages. Each page having the same menu. I need one of this menu item's text to vary according to each of my customers, where the customer id will be passed from an external link at launch time. I also need to change the menu item link <a href.../a> dynamically. I'm planning to create a redir.html pacge for each client and within that page, I can insert a url with parameters to launch the main page. Any clue more than welcome! [CODE]<script type="text/javascript" src="http://www.avalidsite.com/FlashRules.js" DOMSET = "IC"; GMPNT = "500"; LUCKYB = "TRUE"; CUBAN = "TRUE";> </script>[CODE] What the heck is wrong with the above snippet? When the JavaScript is invoked the values that have been entered for the variables are not present. If I try to reference the value of "DOMSET" for example it is shown to be "undefined"??? Hi all, I've written the following script: Code: <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Keys2</title>
<script type="text/javascript">
function keyPress(key){
document.getElementById('rect01').style.fill = "red";
}
</script>
<style>
.button {
width: 100px;
padding-right:10px;
height:2em;
background-color:#FC3;
border-radius:3px;
color:#fff;
font-weight:bold;
}
ul {
list-style-type: none;
padding: 0;
margin-left:25px;
}
li {
float:left;
width:30px;
margin-right:25px;
padding:10px;
height:2em;
background-color:#FC3;
font-size:xx-large;
}
</style>
</head>
<body>
<div>
<svg width="1000" height="200">
<rect x="25" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect01"/>
<rect x="100" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect02"/>
<rect x="175" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect03"/>
<rect x="250" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect04"/>
<rect x="325" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect05"/>
<rect x="400" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect06"/>
<rect x="475" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect07"/>
<rect x="550" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect08"/>
</svg>
</div>
<div>
<ul>
<li><a href="#" class="button" onClick="keyPress(rect01);">A</a></li>
<li><a href="#" class="button" onClick="keyPress(rect02);">B</a></li>
<li><a href="#" class="button" onClick="keyPress(rect03);">C</a></li>
<li><a href="#" class="button" onClick="keyPress(rect04);">D</a></li>
<li><a href="#" class="button" onClick="keyPress(rect05);">E</a></li>
<li><a href="#" class="button" onClick="keyPress(rect06);">F</a></li>
<li><a href="#" class="button" onClick="keyPress(rect07);">G</a></li>
<li><a href="#" class="button" onClick="keyPress(rect08);">H</a></li>
</ul>
</div>
</body>
</html>
Now, I could write a version of the keypress function for each rectangle, but that seems like poor coding. Can anyone point out how I might restructure the function or the code so that I can pass the number in the onClick to the rectangle it refers to? Thanks I am trying to pass a value using a parameter in html (asp) to a javascript function. When I try to pass a value inside of a variable <INPUT type="submit" value="Next Youth" name=button1 onclick="OnButton1(tst);"> it simply doesn't work (no error msg - just nothing) while if I put a value in the call <INPUT type="submit" value="Next Youth" name=button1 onclick="OnButton1('5393');"> it works fine. The javascript looks like this: function OnButton1(tst) { var pth = "youth_edit3.asp?cIndex=" + tst; document.YouthEdit.action = pth; document.YouthEdit.submit(); // Submit the page } I've set tst = "5393" but it won't work when I try to pass it. Only a literal value of '5393' works. What am I doing wrong? Thank you in advance. |
|||||||