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

Code:

<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

Code:

<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:

Code:

<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>

Thread: How to let 2 javascript work seperately?

Thread Tools

Search Thread

How to let 2 javascript work seperately?

Bookmarks

Bookmarks

Posting Permissions