Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
I've been trying to get this "this" to work, to bind it to an/any HTML element that the function is applied to. I'm trying to keep it universal to make it possible to apply the same function to multiple HTML elements.
Note:
I don't want to mess with ids nor classes and such since I want to keep the function as universal as possible.
<!doctype html>
<html>
<body>
<input type="button" value="Old" onClick="Change(this);">
<script type="text/javascript">
function Change(){
this.innerHTML = "New";
};
</script>
</body>
</html>
innerHTML won't work in this case. Being that this is an input, try using value instead.
var input = document.querySelector('input');
input.addEventListener('click', Change);
function Change(){
this.value = "New";
this.removeEventListener('click', Change);
}
<input type="button" value="Old" />
The problem is that when the page hits the input the Change function is not defined. Try the following:
<!doctype html>
<html>
<body>
<script type="text/javascript">
function Change(){
this.value = "New";
};
</script>
<input type="button" value="Old" onClick="Change.call(this);">
</body>
</html>
Note that I have changed the input's onClick to Change.call(this). And that the script is loaded before the control.
You can see a working fiddle here. Note that the JavaScript settings is configured so that the script is loaded in the head (Hit the cog in the JavaScript section).
Related
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
Im a noob at js, and I would like to make a go bar like at the top of browsers in html and js. It will go to the url in the box when the button is pressed nothing more, nothing less. Heres about what i want:
In javascript you just have to add an event listener in the "Go" button.
Then when you click the button, you just have to redirect the url according to the text field value.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="text" id="field" />
<button id="myBtn">Go</button>
<script type="text/javascript">
document.getElementById("myBtn").addEventListener("click", function(){
var url = document.getElementById("field").value;
window.location.href = url;
// OR
window.open(url);
});
</script>
</body>
</html>
With this code, if you enter a value in the text field and click the button. The url will add your value at the end.
For example if you are testing on the url localhost/ and you enter "test", javascript will redirect you to localhost/test.
To redirect correctly you must write "http://" or "https://" at the beginning
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
Good Morning,
I am having difficulty firguring out why this following Javascript method is not working.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!--Author: Alejandro Deguzman Jr-->
<html>
<head>
<title>Realtor Inquiry</title>
<script type="text/javascript">
/* <![CDATA[ */
function termAgreed() {
if (document.getElementByID.checked == true) {
window.alert("Works!");
}
}
/* ]]> */
</script>
</head>
<body>
<form>
<input type="checkbox" id="agree" value="Terms" type="checked" checked="unchecked">Agree with the Terms & Conditions<br>
</form>
</body>
</html>
What im am trying to accomplish with the code above is when the checkbox is checked a prompt will appear. I did'ny quite know how to search for this specific answer I was looking for.
1) As suggested above you need to call your function inside your HTML. Use onchange() and call the function on change of check box.
2)You need to correct syntax of selecting element. its Id not ID and also pass the Id of element you want to select.
function termAgreed() {
if (document.getElementById("agree").checked == true) {
window.alert("Works!");
}
}
<input type="checkbox" id="agree" onchange="termAgreed()" value="Terms" checked="unchecked">Agree with the Terms & Conditions
I modified your termAgreed slightly. Please note that querySelector is not available in older browsers. I added a portion at the end to add the change event to the checkbox:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!--Author: Alejandro Deguzman Jr-->
<html>
<head>
<title>Realtor Inquiry</title>
<script type="text/javascript">
/* <![CDATA[ */
function termAgreed() {
if (document.querySelector('#agree').checked) {
window.alert("Works!");
}
}
/* ]]> */
</script>
</head>
<body>
<form>
<input type="checkbox" id="agree" value="Terms" type="checked" checked="unchecked">Agree with the Terms & Conditions<br>
</form>
<script type="text/javascript">
document.querySelector('#agree').addEventListener('change', termAgreed);
</script>
</body>
</html>
First, you're not using getElementById correctly. You need to pass in the element you're looking to find. Like so, getElementById("agree"). And as others have already posted in the comments, you're not calling 'termAgreed' in your code.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
Suppose I have two html files: 'page1' and 'page2'
Code in page1:
<html>
<body>
page1
click to go to page 2
</body>
</html>
Code in page2:
<html>
<body>
page2
click to go to page 1
</body>
</html>
Using this I can open page2 using hyperlink in page1 in a new tab in the same window and viceversa
Is it possible to the same thing using javascript
lots of way possible ..
1.
<script language="javascript" type="text/javascript">
window.location.href="login.jsp?backurl="+window.location.href;
</script>
2.
<script language="javascript">
alert("back");
window.history.back(-1);
</script>
3.
<script language="javascript">
window.navigate("top.jsp");
</script>
4.
<script language="JavaScript">
self.location="top.htm";
</script>
5.
<script language="javascript">
alert("Access Violation");
top.location="error.jsp";
</script>
6.
<script language="javascript">
window.location = window.location.host;
</script>
check this question here.you can use
// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");
// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";
You can add an click event listener to your link element (or any other) and set the href property in the location object. Let’s use inline onclick for illustration:
Link
By clicking on this element, the onclick handler will be executed, setting the href, i.e. the current address. By returning false, the default action will be prevented (see MouseClick.preventDefault()).
This is kind of a JavaScript surrogate for HTML hypertext behavior. You also can do other cool things with Window.location.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
I am lost, I just started programming and the code I have doesn't quite show what I'm trying to do, and is unfinished. However, my problem is I am trying to figure out how to take HTML form data entered by a user, and when a button is pressed its submits the data to a string variable in the sites Javascript. The challenge is that I can't use any server-side script, only HTML, CSS, Javascript, and I have to JQuery. I have look everywhere on how to do this for weeks. I can't find anything helpful for what I'm attempting.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="main.css">
<script>
<!--
function storageCheck01(){
if(typeof(Storage)!=="undefined"){
activeSession();
}
else{
var b0002=document.getElementById("wrapper");
b0002.style.display="none";
document.write("No Support!");
};
}
function activeSession(){
if(typeof localStorage.visitCount !== "undefined"){
++localStorage.visitCount;
if(typeof sessionStorage.c02 !== "undefined"){
userData();
}else{
setCookie();
};
}else{
localStorage.visitCount = 1;
setCookie();
};
}
function setCookie(){
sessionStorage.c01=date();
sessionStorage.c02=screen.availWidth;
sessionStorage.c03=screen.availHeight;
userData(sessionStorage.c01, sessionStorage.c02, sessionStorage.c03);
}
function userData(date, width, hight, ){
}
addEventListener('load',storageCheck01,false);
-->
</script>
</head>
<body>
<form>
<!-- ADD FORM DATA TO RETRIEVE USERDATA -->
</form>
</body>
</html>
Well, it sounds like you are just trying to take a form and capture the user's input when they click submit. No need to post to a different file.
So, it is simply having a button putting an onclick event and then calling a function in the javascript. This javascript would use the document.getElementById(nameofObject).value.
Example:
<html>
<head>
<title>New Page 1</title>
<script language="JavaScript" type = "text/javascript">
<!--
function Test()
{
alert(document.getElementById("testinput").value);
}
//..>
-->
</script>
</head>
<body>
<form name="textfield">
<input type="text" name="T1" size="20" id="testinput">
<input type="button" value="Click Here" name="B1" onClick="Test()"></p>
</form>
</body>
</html>
Source: http://www.java2s.com/Tutorial/JavaScript/0460__DOM-Node/Getelementfromadocumentbyid.htm
If you just want to submit the data to the server, you don't have to use any JavaScript at all. When you put an "input" element in the form, for example, an "input type='text'" element, which creates a text box, the text box's value is automatically submitted to the server as a form variable, with the key being the name of the element, when use press the submit button. You can then use whatever code/platform you use on the server side to get the variable value.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I want chance a Text with javascript i use the following code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Test</title>
<script type="text/javascript">
var Neu = document.getElementById("thema")[0].value;
function Aendern () {
document.all.meinAbsatz.innerHTML = Neu;
}
</script>
</head><body>
<p id="meinAbsatz">Text</p>
<input id="thema" type="text" value="Test Theme" />
chance theme
</body>
</html>
If I click on "chance theme" the "Text" chance to "undefined"
Method getElementById() returns a single element, not a set of elements. So there is no need in applying [0] to it. Also you should put the Neu initialization inside Aendern() function:
function Aendern() {
var Neu = document.getElementById("thema").value;
document.all.meinAbsatz.innerHTML = Neu;
}
DEMO: http://jsfiddle.net/RqgMb/
http://jsfiddle.net/FJr2t/
In the link above I made your code work.
Your two major problems are:
var Neu = document.getElementById("thema")[0].value;
Firstly, getElementById('thema') returns only one item, so you should drop the [0].
Secondly javascript code in your head gets executed once, when loading. So this line once gets executed at the very beginning and reads the value the input element has then.
So you should also move it into your Aendern method.
P.S.: Putting your code in window.onload etc. is not neccessary in this case, but you should definilty look at it and do it.