In the code below, whenever I click on the submit button, multiple window's open up as it it were in infinite loop. If I unment alert, then multiple alerts keep popping like they were in infinite loop. Why could this be happening ?
<html>
<head>
<script type = "text/javascript">
var window;
function moveBy() {
//alert("-- hello ---");
window = window.open("");
window.moveBy(10, 20);
}
</script>
</head>
<body>
<input type = "submit" value = "moveBy" onclick = "moveBy()"> </input>
</body>
</html>
In the code below, whenever I click on the submit button, multiple window's open up as it it were in infinite loop. If I unment alert, then multiple alerts keep popping like they were in infinite loop. Why could this be happening ?
<html>
<head>
<script type = "text/javascript">
var window;
function moveBy() {
//alert("-- hello ---");
window = window.open("http://www.w3schools.");
window.moveBy(10, 20);
}
</script>
</head>
<body>
<input type = "submit" value = "moveBy" onclick = "moveBy()"> </input>
</body>
</html>
- 6 You have a three line function and can't see why it's looping infinitely? – j08691 Commented Nov 4, 2015 at 16:54
-
1
When you declare a function in the global scope, it attaches to the
windowobject in the browser. That said, you create a function calledmoveBythen call it within itself. – doogle Commented Nov 4, 2015 at 16:55 -
You can't assign a new value to
window.window = ....doesn't change the value ofwindow, so thewindowin the last line of your function is still the globalwindowobject. – JLRishe Commented Nov 4, 2015 at 16:56 - When you use recursion in js you must always have an exit case to prevent infinite loops. – colecmc Commented Nov 4, 2015 at 16:56
- The easiest solution is to name your function something other than an existing method. – j08691 Commented Nov 4, 2015 at 17:02
4 Answers
Reset to default 8Javascript does not support method overloading, so by calling window.moveBy(10, 20); you are actually basically calling moveBy() again, resulting in an infinite loop.
Calling a function from itself is called recursion. The linked post is a good read on this topic, and will guide you on where you might want it. But in your case you clearly don't.
Have a read of this article for more detail.
To prevent this from happening, you can rename your moveBy() function to myMoveBy() or better openAndMoveBy()
Because you call function moveBy from itself.
You are creating a recursion (function that calls itself) by calling window.moveBy inside your moveBy function without stating a break point or exit case:
function moveBy() {
//alert("-- hello ---");
window = window.open("http://www.w3schools.");
window.moveBy(10, 20); //recursion, it will call this function over and over again.
}
Maybe what you want is to use another name for your function and call the actual window.moveBy inside with predefined parameters:
function customMoveBy() {
//alert("-- hello ---");
window = window.open("http://www.w3schools.");
window.moveBy(10, 20);
}
<input type = "submit" value = "moveBy" onclick = "customMoveBy()"> </input>
The problem is that you are calling the function moveBy inside the funtion moveBy. Whenever you execute the function you call it again and again ...
Try this:
<html>
<head>
<script type = "text/javascript">
var window;
function moveBy() {
alert("-- hello ---");
window = window.open("http://www.w3schools.");
//window.moveBy(10, 20);
}
</script>
</head>
<body>
<input type = "submit" value = "moveBy" onclick = "moveBy()"> </input>
</body>
</html>