Log in

View Full Version : How to let 2 javascript work seperately?


wee3200
09-01-2010, 07:57 AM
This is my code,
it will generate 2 javascript multiply table,
but i cant run the table at the right-side directly,
i must run the table at the left-side 1st, then i only can function the table at right-side correctly



<html>
<head>
</head>
<body>
<table border=1>
<tr><td>


<table border=1>
<tr><td>

<table border=1>
<form name=frmOne>
<tr><td>
Start Number: <input type=text Name=txtStart Size=15 >
</td><td>
End Number: <input type=text Name=txtEnd Size=15>
</td><td>
</td></tr>
</table>

<center>
<table border=1>
<tr><td>
Multiply By: <input type=text Name=txtTimes Size=15>
</td></tr>
</table>


<table border=1>
<tr><td>
<input type=button value="Times Table" onClick=calculate()>
</td></tr>
<table>

<table border=1>
<tr><td>
<input type=reset value="Reset">
</td></tr>
</table>

<table border=1>
<tr><td>
<textarea name=taOne rows=8 cold=60></textarea>
</td></tr>
</table>
</form>
</table>

<td valign=top>

<table border=1>
<tr><td>

<table border=1>
<form name=frmOne1>
<tr><td>
Start Number: <input type=text Name=txtStart1 Size=15 >
</td><td>
End Number: <input type=text Name=txtEnd1 Size=15>
</td><td>
</td></tr>
</table>

<center>
<table border=1>
<tr><td>
Multiply By: <input type=text Name=txtTimes1 Size=15>
</td></tr>
</table>

<table border=1>
<tr><td>
<input type=button value="Times Table" onClick=cal()>
</td></tr>
<table>

<table border=1>
<tr><td>
<input type=reset value="Reset">
</td></tr>
</table>

<table border=1>
<tr><td>
<textarea name=taOne1 rows=8 cold=60></textarea>
</td></tr>
</table>
</form>

</table>

<script language=javascript>
function calculate() {

start = document.frmOne.txtStart.value
end = document.frmOne.txtEnd.value
times = document.frmOne.txtTimes.value

if(Number(start) && Number(end) && Number(times)) {
start = Number(start)
end = Number(end)
times = Number(times)
result = document.frmOne.taOne
for(i = start; i <= end; i++) {
answer = i * times
result.value = result.value + (i + " times " + times + " = " + answer + "\n")
}
}
else {
alert("Please enter numbers in the boxes")
}
}


function cal() {

start1 = document.frmOne1.txtStart1.value
end1 = document.frmOne1.txtEnd1.value
times1 = document.frmOne1.txtTimes1.value

if(Number(start1) && Number(end1) && Number(times1)) {
start1 = Number(start1)
end1 = Number(end1)
times1 = Number(times1)
result1 = document.frmOne1.taOne1
for(j = start; j <= end; j++) {
answer1 = j * times1
result1.value = result1.value + (j + " times1 " + times1 + " = " + answer1 + "\n")
}
}
else {
alert("Please enter numbers in the boxes")
}
}

</script>


</body>
</html>
vwphillips
09-01-2010, 03:48 PM
<html>
<head>
</head>
<body>
variables declared out side a function are global.<br />
variables declared in side a function NOT preceaded by 'var' are global.<br />
variables declared in side a function preceded by 'var' are local.<br />
global variables should be avoided where possible. <br />
<table border=1>
<tr><td>


<table border=1>
<tr><td>

<table border=1>
<form name=frmOne>
<tr><td>
Start Number: <input type=text Name=txtStart Size=15 >
</td><td>
End Number: <input type=text Name=txtEnd Size=15>
</td><td>
</td></tr>
</table>

<center>
<table border=1>
<tr><td>
Multiply By: <input type=text Name=txtTimes Size=15>
</td></tr>
</table>


<table border=1>
<tr><td>
<input type=button value="Times Table" onClick=calculate()>
</td></tr>
<table>

<table border=1>
<tr><td>
<input type=reset value="Reset">
</td></tr>
</table>

<table border=1>
<tr><td>
<textarea name=taOne rows=8 cold=60></textarea>
</td></tr>
</table>
</form>
</table>

<td valign=top>

<table border=1>
<tr><td>

<table border=1>
<form name=frmOne1>
<tr><td>
Start Number: <input type=text Name=txtStart1 Size=15 >
</td><td>
End Number: <input type=text Name=txtEnd1 Size=15>
</td><td>
</td></tr>
</table>

<center>
<table border=1>
<tr><td>
Multiply By: <input type=text Name=txtTimes1 Size=15>
</td></tr>
</table>

<table border=1>
<tr><td>
<input type=button value="Times Table" onClick=cal()>
</td></tr>
<table>

<table border=1>
<tr><td>
<input type=reset value="Reset">
</td></tr>
</table>

<table border=1>
<tr><td>
<textarea name=taOne1 rows=8 cold=60></textarea>
</td></tr>
</table>
</form>

</table>

<script language=javascript>
function calculate() {
var start = document.frmOne.txtStart.value
var end = document.frmOne.txtEnd.value
var times = document.frmOne.txtTimes.value
if(Number(start) && Number(end) && Number(times)) {
start = Number(start)
end = Number(end)
times = Number(times)
result = document.frmOne.taOne
for(var i = start; i <= end; i++) {
answer = i * times
result.value = result.value + (i + " times " + times + " = " + answer + "\n")
}
}
else {
alert("Please enter numbers in the boxes")
}
}


function cal() {
var start = document.frmOne1.txtStart1.value
var end= document.frmOne1.txtEnd1.value
var times= document.frmOne1.txtTimes1.value
if(Number(start) && Number(end) && Number(times)) {
start = Number(start)
end = Number(end)
times = Number(times)
var result = document.frmOne1.taOne1
for(var j = start; j <= end; j++) {
answer = j * times
result.value = result.value + (j + " times " + times + " = " + answer + "\n")
}
}
else {
alert("Please enter numbers in the boxes")
}
}

</script>


</body>
</html>
jscheuer1
09-01-2010, 03:54 PM
One function should work for both forms, my take on this:


<html>
<head>
</head>
<body>
<table border=1>
<tr><td>


<table border=1>
<tr><td>

<table border=1>
<form name=frmOne>
<tr><td>
Start Number: <input type=text Name=txtStart Size=15 >
</td><td>
End Number: <input type=text Name=txtEnd Size=15>
</td><td>
</td></tr>
</table>

<center>
<table border=1>
<tr><td>
Multiply By: <input type=text Name=txtTimes Size=15>
</td></tr>
</table>


<table border=1>
<tr><td>
<input type=button value="Times Table" onClick=calculate(this.form)>
</td></tr>
<table>

<table border=1>
<tr><td>
<input type=reset value="Reset">
</td></tr>
</table>

<table border=1>
<tr><td>
<textarea name=taOne rows=8 cold=60></textarea>
</td></tr>
</table>
</form>
</table>

<td valign=top>

<table border=1>
<tr><td>

<table border=1>
<form name=frmOne1>
<tr><td>
Start Number: <input type=text Name=txtStart Size=15 >
</td><td>
End Number: <input type=text Name=txtEnd Size=15>
</td><td>
</td></tr>
</table>

<center>
<table border=1>
<tr><td>
Multiply By: <input type=text Name=txtTimes Size=15>
</td></tr>
</table>

<table border=1>
<tr><td>
<input type=button value="Times Table" onClick="calculate(this.form);">
</td></tr>
<table>

<table border=1>
<tr><td>
<input type=reset value="Reset">
</td></tr>
</table>

<table border=1>
<tr><td>
<textarea name=taOne rows=8 cold=60></textarea>
</td></tr>
</table>
</form>

</table>

<script type="text/javascript">

function calculate(form) {

var start = form.txtStart.value, end = form.txtEnd.value, times = form.txtTimes.value, result, answer, i;

if(Number(start) && Number(end) && Number(times)){
start = Number(start);
end = Number(end);
times = Number(times);
result = form.taOne;
for(i = start; i <= end; i++){
answer = i * times;
result.value = result.value + (i + " times " + times + " = " + answer + "\n");
}
} else {
alert("Please enter numbers in the boxes");
}
}

</script>


</body>
</html>