When I type in an ID number for the game, I always gets the 3rd statement of my if else expression. Where am I going wrong?!!
<html>
<body>
<p>Type in the ID and hit search:</p>
<button onclick="myFunction()">Search</button>
<p id="demo"></p>
<form>
<input id="textbox" type="text" />
</form>
<script>
var textboxValue = document.getElementById("textbox").value;
function myFunction() {
var message;
if (textboxValue == 1) {
message = "Fantasy World";
} else if (textboxValue == 2) {
message = "Sir Wags A Lot";
} else {
message = "Take a Path";
}
document.getElementById("demo").innerHTML = message;
}
</script>
</body>
</html>
The problem is you always test the same, initial, value of the input.
Change
var textboxValue = document.getElementById("textbox").value;
function myFunction() {
to
function myFunction() {
var textboxValue = document.getElementById("textbox").value;
This way the value will be read each time the function is called.
Put this statement:
var textboxValue = document.getElementById("textbox").value;
Inside the function.
Related
I want to retrieve the variable x from the function, but this code does not work
who has an idea
thank you
function myFunction(){
var x = document.getElementById("nom").value;
//document.getElementById("demo").innerHTML =x ;
return x;
}
response = myFunction();
document.getElementById("deux").innerHTML =response ;
<form class="form">
<label>Entre ton nom</label>
<input type="text" id="nom" name="Nom" placeholder="Nom" value="" class="form-control">
<input type="button" name="Envoyer" class="btn btn-default" value="Envoyer" onclick="myFunction();">
</form>
<script src="test-envois.js"></script>
<p id="deux"></p>
<p id="demo"></p>
From what can I see in the code is that you want to add the response to the deux id when you click on the button
The problem in that is that response executes the moment you load the page.
You need to add that logic inside the function like this:
function myFunction() {
var x = document.getElementById("nom").value;
//document.getElementById("demo").innerHTML =x ;
// let response = myFunction();
document.getElementById("deux").innerHTML = x;
}
And now it executes when you click the button
If I understand right, you want whatever the user inputs in the form "nom" to be displayed in the paragraph tag "deux"?
if that’s the case you could just do:
function myFunction() {
var x = document.getElementById("nom").value;
document.getElementById("deux").innerHTML = x;
}
you can enclose all the code into one function, no need to separate it
function myFunction(){
var x = document.getElementById("nom").value;
affichepanier(x);
}
function affichepanier(val)
{
var variableOfFunction1 = val;
document.getElementById("deux").innerHTML =variableOfFunction1 ;
}
I'm completely new to JavaScript, and don't know why this isn't working. When I click on the input box, and type in less than 5 characters, i want a message to display. The message is simply not showing. Source code: https://jsfiddle.net/015por64/
<html>
<body>
<form id="form>">
<input id="input">
<div id="text"> Test </div>
</input>
</form>
</body>
</html>
<script>
function checkUserName(e, minLength) {
var username = document.getElementById("input");
var usernameLength = username.textContent;
if (usernameLength.value.length < 5) {
msg = "Your username must consist of at least five characters."
};
else {
msg = "";
text.innerHTML=msg
};
}
var text = document.getElementById("text");
text.addEventListener("blur", function(e) {checkUserName(e, 5)}, false)
</script>
Few issues with your code:
you need to attach the event to #input and not the div#text.
you need to read value of #input and not textcontent
; after if is wrong because then else will give syntax error.
<html>
<body>
<form id="form>">
<input id="input">
<div id="text"> Test </div>
</input>
</form>
</body>
</html>
<script>
function checkUserName(e, minLength) {
var username = document.getElementById("input");
var usernameLength = username.value;
if (usernameLength.length < 5) {
msg = "Your username must consist of at least five characters.";
text.innerHTML=msg;
}else {
msg = "";
text.innerHTML=msg;
};
}
var text = document.getElementById("text");
document.getElementById('input').addEventListener("blur", function(e) {checkUserName(e, 5);}, false)
</script>
It should be the input where you have to put the blur event listener.
var input = document.getElementById("input");
And since you have no use for text outside the function, better define it inside.
i want to display an confirm box with two button yes and no, when user press yes than index page will be displayed and when user press no this redirect to another page. this confirm msgbox display only once when first time website open not on every reloading of page. Thanks
you can try this code
<script>
var confirm = confirm("sample message?");
if(confirm) {
// index page
window.location.url = ""; // your url index page
} else {
// other page
window.location.url = ""; // your url other page
}
</script>
You have to do all stuff in javascript.
Javascript Function you can use.
Also you need to set cookie at browser and check if cookie is set.
function myFunction() {
var x;
if (confirm("Press a button!") == true) {
x = "You pressed OK!";
} else {
x = "You pressed Cancel!";
}
document.getElementById("demo").innerHTML = x;
}
Hope this helps.
function myFunction() {
var txt;
var r = confirm("Press a button!");
if (r == true) {
txt = "You pressed OK!";
} else {
txt = "You pressed Cancel!";
}
document.getElementById("demo").innerHTML = txt;
}
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<html>
<head>
<title>Are you sure?</title>
<script>
function areYouSure() {
var res = confirm("Are you sure?");
return res; //true or false
}
</script>
</head>
<body>
<form method="POST" action="action_page.php">
<!--
...
-->
<input type="submit" onclick="return areYouSure()"/>
</form>
</body>
</html>
So I'm trying to take an element submitted into an input field and return a result using if else statements but it keeps returning my "else" statement no matter what. I used a w3schools project to begin with, but I can't seem to see what is going wrong.
The user will put a number is the "numSpots" input field and depending on the value of the number, an adaSpots value will get returned in the paragraph id="demo"
Here is my code
function myFunction() {
var numSpots = document.getElementById("numSpots");
var adaSpots;
if (numSpots < 25) {
adaSpots = "1";
} else {
adaSpots = "267";
}
document.getElementById("demo").innerHTML = adaSpots;
}
<p>Click the button to display a time-based greeting:</p>
<input type="number" name="numSpots" id="numSpots" />
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
you need to get the value of #numbSpots by document.getElementById("numSpots").value
function myFunction() {
var numSpots = document.getElementById("numSpots").value;
var adaSpots;
if (numSpots < 25) {
adaSpots = "1";
} else {
adaSpots = "267";
}
document.getElementById("demo").innerHTML = adaSpots;
}
<p>Click the button to display a time-based greeting:</p>
<input type="number" name="numSpots" id="numSpots" />
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
Try this ;)
You need to use parseInt function to convert string into integer value as text field value is returned as string; and you forgot to get the value using value property;
function myFunction() {
var numSpots = document.getElementById("numSpots").value;
var adaSpots;
if (parseInt(numSpots) < 25) {
adaSpots = "1";
} else {
adaSpots = "267";
}
document.getElementById("demo").innerHTML = adaSpots;
}
<html>
<head>
<script type="text/javascript">
var c=0;
var t;
var timer_is_on=0;
function timedCount()
{
document.getElementById('txt').value=c;
if(c == 100) return;
c=c+1;
t=setTimeout("timedCount()",30);
}
function doTimer()
{
if (!timer_is_on)
{
timer_is_on=1;
timedCount();
}
}
</script>
</head>
<body onload="doTimer()">
<form>
<input type="button" value="Start count!">
<input type="text" id="txt">
</form>
<p>Click on the button above. The input field will count forever, starting at 0.</p>
</body>
</html>
I want to change
<input type="text" id="txt">
into
<div type="text" id="txt">
It doesn't work.
I think the problem is
document.getElementById('txt').value=c;
But I tried
document.getElementById('txt').innerHTML=c;
It still doesn't work.
Could someone tell me why?
Cheers!!!
Setting the value of the textbox is going to populate the text in the textbox. If you want to replace an input with a div you should use:
element.replaceChild(newDiv, oldTextbox);
Try:
var div = document.createElement("DIV");
div.id = "txt";
div.innerText = "Hello world!";
var tb = document.getElementById("txt");
tb.parentElement.replaceChild(div, tb);
Try changing <div type="text" id="txt"> to <div id="txt">
Basically, you're asking about doing this:
var d = document.createNode("div")
d.setAttribute("id", "txt")
d.setAttribute("type", "text");
var input = document.getElementById( "txt" );
input.parentElement.replaceChild( d, input );
But I think you're better off:
function timedCount()
{
document.getElementById('txt').value=c;
if(c == 100) return;
c=c+1;
t=setTimeout("timedCount()",30);
}
function doTimer()
{
if (!timer_is_on)
{
// set the input to readOnly, this allows JS to update it without
// letting the user modify the value.
document.getElementById('txt').readOnly = true
timer_is_on=1;
timedCount();
}
}