I am trying to combine these two snippets of code but it will not fire the complete appropriate responses. I feel its something simple I have overlooked. In this case the first request fires an appropriate response which is Math.min() returns the lowest
value and it does so promptly. However the second part, When the input field gets focus, a function is triggered which changes the background-color, will not respond to user input when the field is clicked, it does not turn yellow but remains white. Now the
second curious occurrence is that if one does not click the try it button for the Math.min() option but instead tries to click the input field in the second prompt, the input field still will not turn yellow but an unexpected results occurs which is that it
will display the answer to the first code on top, the Math.min() prompt. I also reversed the order of the scripts with similar results but in either case the prompts do not respond according to what they are each called to do and without unexpected results.
I am using IE11 but the same results occur in Google. Below are HTML file exactly as it appearshtml red rect and
the Javascript file exactly as it appears in the redrectangle.js below as I have them in each of the two files. What rule am I missing ( I tried combining different function myFuncttion without problems without math objects but
it seems the any math scripts throw the input field/yellow background color out the window) or is there any error in code that I missed? Please be gracious enough to respond this inquiry as it is very confounding.
the exact HTML :
<!DOCTYPE html
<html>
<head>
<script src="redrectangle.js" type="text/javascript"></script>
</head>
<body>
<p>Math.min() returns the lowest value.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
</body>
<script src="redrectangle.js" type="text/javascript"></script>
<body> Enter your name: <input type="text" onfocus="myFunction(this)">
<p>When the input field gets focus, a function is triggered which changes the background-color.</p> </body>
</html>
the Javascript file:
function myFunction(x) {
x.style.background = "yellow";
}
function myFunction() {
document.getElementById("demo").innerHTML =
Math.min(0, 150, 30, 20, -8, -200);
}
I also tried this arrangement of code below, what occurs is that the first request will create the appropriate response and display the yellow input field upon clicking the fieldbut no response on the second code, the calculate the largest number, try it button.
the exact HTML :
<!DOCTYPE html>
<html>
<head>
<script src="redrectangle.js" type="text/javascript"></script>
<body> Enter your name: <input type="text" onfocus="myFunction(this)">
<p>When the input field gets focus, a function is triggered which changes the background-color.</p> </body>
<script src="redrectangle.js" type="text/javascript"></script>
</head>
<body>
<p>Infinity is returned if you calculate a number outside the largest possible number.</p><button onclick="myFunction()">Try it</button><p id="demo"></p>
</body>
</html>
the .js script:
function myFunction() {
var myNumber = 2;
var txt = "";
while (myNumber != Infinity) {
myNumber = myNumber * myNumber;
txt = txt + myNumber + "<br>";
} document.getElementById("demo").innerHTML = txt;
}
function myFunction(x) {
x.style.background = "yellow";
}
When I reversed the order the response for the largest possible number is automatically fired and the input field below it will not turn the background yellow see here:
Infinity is returned if you calculate a number outside the largest possible number.
Try it
4
16
256
65536
4294967296
18446744073709552000
3.402823669209385e+38
1.157920892373162e+77
1.3407807929942597e+154
Infinity
Enter your name:
When the input field gets focus, a function is triggered which changes the background-color.
Would appreciate any assistance, I feel its something simple that I have overlooked.