I want the data in the text field to transfer to a popup, but when I trigger the popup, it is always blank, no matter what is in the box.
<html>
<head>
<title>Popup</title>
</head>
<body>
<button onclick="popup()">Click for popup</button>
<input type="text" name=popupMess><br>
</body>
<script>
function popup() {
window.confirm(name.popupMess);
}
</script>
</html>
<html>
<head>
<title>Popup</title>
</head>
<body>
<button onclick="popup()">Click for popup</button>
<input id="popupMess" type="text"><br>
</body>
<script>
function popup() {
alert(document.getElementById('popupMess').value);
}
</script>
</html>
You forgot the " in name="popupMess".
function popup () {
var text = document.querySelector("input[name='popupMess']").value;
window.confirm(text);
}
Hi here is my jsfiddle that demonstrates the functionality
http://jsfiddle.net/7pjqfcvd/2/
you have to
mark the input element with an Id
<input type="text" id="popupMess"/>
use the id in document.getElementById call to obtain the input element
var elem = document.getElementById("popupMess");
retrieve the value from the element and pass it into the messagebox
window.confirm(elem.value);
But still if you want to use name then try this...
<html>
<head>
<title>Popup</title>
</head>
<body>
<button onclick="popup()">Click for popup</button>
<input type="text" name=popupMess><br>
<script>
function popup() {
var d = document.getElementsByName("popupMess");
window.confirm(d[0].value);
}
</script>
</body>
</html>
Related
Why won't the code display the text from the textbook in the paragraph tag? I tried to take the code from the text box by using the onclick command and the function getVal() but it won't work.
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script src="test.js">
function getVal1(){
var text = document.getElementById('text').value;
var par = document.getElementById('par');
par.innerHTML=text
}
</script>
</head>
<body>
<form>
<input type="text" id="text">
<input type="submit" value="Submit" onclick="getVal1()">
</form>
<p id="par"></p>
</body>
</html>
It cant work because you submit (which includes a reload) of the page.
Take a input type="button"instead.
function getVal1() {
var text = document.getElementById('text').value;
var par = document.getElementById('par');
par.innerHTML = text
}
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<form>
<input type="text" id="text">
<input type="button" value="Submit" onclick="getVal1()">
</form>
<p id="par"></p>
</body>
</html>
As the following, in codeigniter view, I want to call twice js events- 'onchange' and 'onblur' function
Is it possible? How can I call?
Please see below code.
<html>
<bods >
<input type="text" value="here is a text field" onblur="alert('Blur Event!')" onchange="alert('Change Event!')" >
</body>
</html>
<!DOCTYPE html>
<html>
<body>
Enter your name: <input type="text" id="fname" onchange="alert('ok')" onblur="blurfunction()">
<script>
function blurfunction() {
var x = document.getElementById("fname");
x.value = x.value.toLowerCase();
}
function keyupcall(){
var x = document.getElementById("fname");
x.value = x.value.toUpperCase();
}
</script>
</body>
</html>
Both the methods will called at the same time, I am not sure for what purpose you required it.
But you can write both the method as following.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("input").change(function(){
alert("The text has been changed.");
});
$("input").blur(function(){
alert("This input field has lost its focus.");
});
});
</script>
</head>
<body>
<input type="text">
<p>Write something in the input field, and then click outside the field.</p>
</body>
</html>
first.html
<!DOCTYPE html>
<html>
</head>
<body>
<form>
<script type="text/javascript">
// grab the id number
var theIdNumber = localStorage.getItem("idNumber");
// set the ID in the HTML page
document.getElementById("userId").value = theIdNumber;
</script>
<button type="button" onClick="validateUsernamePassword()">SEND</button>
</form>
</body>
</html>
other.js
function validateUsernamePassword()
{
var idNum = $("#userId").val();
alert('Well the id is :' + idNum);
// more code
}
The alert doesn't print the passed ID ... why ?
Modify your html like this:
<html>
<head>
<title></title>
</head>
<body>
<form>
<button type="button" onClick="validateUsernamePassword()">SEND</button>
<input type="hidden" id="userId"></input>
</form>
<script type="text/javascript">
// grab the id number
var theIdNumber = localStorage.getItem("idNumber");
// set the ID in the HTML page
document.getElementById("userId").value = theIdNumber;
</script>
</body>
</html>
Or you could do just this:
function validateUsernamePassword()
{
var idNum = localStorage.getItem("idNumber");
alert('Well the id is :' + idNum);
// more code
}
The second one is good since you already have the item in localstorage, so ther is no need of assign its value to another element
this trick may help you:
<html>
<head>
</head>
<body>
<dl>
<script>
window.var1 = "hello, world";
</script>
<input type="button" value="click" onclick="clicked()">
<script>
function clicked(){
alert(window.var1);
};
</script>
</body>
I want to replace "ı,ğ,ş" with "i,g,s".
This is my code but i cant find my fault.
And i have to do it with oblur event.
<html>
<head>
<script type="text/javascript">
function replacer()
{
var x=document.getElementById("fname");
x.value=x.value.replace("ı","i");
x.value=x.value.replace("ş","s");
x.value=x.value.replace("ğ","g");
}
</script>
</head>
<body>
Name :<input type="text" id="fname" onblur="replacer()" />
</body>
</html>
I just started learning JavaScript and am wondering why this simple snippet hangs when I click on the "Call function" button. What am I missing?
<html>
<head>
<script type="text/javascript">
function myfunction()
{
document.write("hello");
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction()"
value="Call function">
</form>
</body>
</html>
You need to write inside an element or give an element a value, or you should use document write like that :
<html>
<head>
<script type="text/javascript">
function myfunction()
{
document.getElementById("lblMessage").innerText = "hello";
document.getElementById("txtMessage").value = "hello";
//document.write("hello");
}
</script>
</head>
<body>
<form>
<script type="text/javascript">
document.write("This is written while page processed by browser !<br />");
</script>
<input type="text" id="txtMessage" /><br />
<span id="lblMessage"></span><br />
<input type="button"
onclick="myfunction()"
value="Call function">
</form>
</body>
</html>
If you simply want to see your button doing something then try:
alert("Hello");
instead of the document.write.
Where do you expect the function to output its "hello"? Right into the button's source code? That makes no sense. The browser is confused and hangs.
Document.write doesn't magically insert something at the end of your document. It writes its stuff out right there where it is called.
Not too sure what you mean by "hang"... Try this out... The alerts can be removed, but will inform you of where it is at in execution...
<html>
<head>
<script type="text/javascript">
function myFunction() {
//for debugging
alert('Made it into function');
document.getElementById('MyOutputDiv').innerHTML = 'Word To Your Mom...';
//for debugging
alert('function complete');
}
</script>
</head>
<body>
<input type='button' onclick='myFunction();' value='Call Function'>
<br>
<div id='MyOutputDiv'></div>
</body>
</html>
document.write, but where? You have to specify this.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Hello</title>
</head>
<body>
<pre><script type="text/javascript">
function myfunction() {
d = document.getElementById('hello');
d.style.display = "block";
d = document.getElementById('callme');
d.style.display = "none";
}
</script>
</pre>
<div id="hello" style="display:none">
Hello
</div>
<div id="callme">
<input type="button"
onclick="myfunction()"
value="Call function">
</input>
</div>
</body>
</html>
I can't explain the "hang" but please take a look at this page for a primer on document.write: http://javascript.about.com/library/blwrite.htm I would also like to second that you probably want to write to a specific element in the page rather than just overwriting the entire page.