Simple javascript onclick not working - javascript

Here's the fiddle:
http://jsfiddle.net/5UXkA/
HTML:
<html>
<body>
<input type="button" value="button" onclick="test()" />
</body>
</html>​
JavaScript:
function test() {
alert('hi');
}​
As expected, it is not alerting the data!

ditch the html and body tags, change from onload to nowrap. See http://jsfiddle.net/5UXkA/5/

The issue that I found was in the fiddle. Your function test() was not defined when your the fiddle called it.
I put your javascript in new head tags in the html and it worked. For the purposes of using a fiddle, just use 'onDomReady' instead of onLoad.
http://jsfiddle.net/5UXkA/10/

Related

How to put an internal script inside a div tag?

I am trying to run a javascript inside of a div tag because i have heard its possible but for some reason the code does nothing.
<!DOCTYPE html>
<html>
<body>
<title>XDSITE</title>
<br>
<br>
<div id=mycode style="BACKGROUND:
url('javascript:eval(window.alert("sometext"))'"></div>
</body>
</html>
You have some problems in your HTML it is not valid, you can't run JavaScript from a style attribute.
You can run Javascript from within a <script> tag which really is the best way to do it.
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
Alternatively there are some HTML elements that allow you to execute it on some events, like onchange, onclick etc.
<select onchange="myFunction()">
<button onclick="myFunction()">Click me</button>
https://www.w3schools.com/ is a great resource for learning more about each html element, and also JavaScript as a whole.
Good luck
can you please tell here which java script framework is you are using? you can achieve this by using and template java script framework like Angular, React...
If u dont want to use any framework than you need to write pure javascript or jquery code for assigning the background css prop.
for entire body,
document.body.style.backgroundImage = "url('img_tree.png')";
for div,
document.getElementById("mycode").style.backgroundImage = "url('img_tree.png')";
<!-- U have to give event inside expression like onclick ,mouseup Click that text -->
<div id=mycode onclick="alert('Hi ....sometext')">THARA
</div>
<!DOCTYPE html> <html> <body> <title>XDSITE</title> <br> <br> <div id=mycode style="BACKGROUND: url('javascript:eval(window.alert("sometext"))'"></div> </body> </html>
Answer :
Open script in footer
<script>
$( "#mycode" ).click(function() {
alert( "Hai" );
});
</script>
I hope its working for you ...
You can target HTML tag using getElementById() and then apply custom style like this
document.getElementById("Mydiv").style.backgroundColor="#0000"
or apply a bunch of styles like this
var dev = document.getElementById("Mydiv");
dev.style.backgroundColor="#0000";
dev.style.fontSize="..";
dev.style.backgroundImage="..";
You can run your function using "onerror" event. And also you must do some error in that case. For eg.
<img src="someFakeSrc" onerror='javascript:eval(window.alert("sometext"))'>
HTML doesn't see a src of picture then run a 'onerror' event.

Alert pop-up not showing

I can’t find the problem with my simple code. The button shows, but the alert pop-up doesn’t show when I click on it.
What am I doing wrong?
<DOCTYPE! html>
<html>
<body>
<h1>This will be a test for Javascript</h1>
<button> onclick=“myFunction()”>I like it</button>
<script>
function myFunction() {
alert(“are you sure?”);
}
</script>
</body>
</html>
Problem in smart quotes.
Use
"
quotes.
<button onclick="ok()">Ok</button>
<script>
function ok() {
alert("ok");
}
</script>
Use "" not “ in your code
Try to write your js code before html "button" code.
And try also to add a comma in the end of onclick script.

Javascript run() Function is Not Defined

I know there are a lot of questions like this, but none of them seemed to solve my problem. I have this piece of code that won't run because it says Uncaught ReferenceError: run is not defined. I have tried to move the function into the body of the HTML, but to no avail. My code:
<!DOCTYPE html>
<html>
<textarea name="Text1" cols="100"rows="20" id="textbox">
</textarea>
<button onclick="run()">Export to C++</button>
<script type="text/javascript">
function run() {
var code=new Array();
var input = document.getElementById("textbox").value;
//convert things that are not subroutines here
code.push(input);
code.push("}");
...
for (var i=0;i<code.length;i++)
{
document.write(code[i]+"<br>");
}
}
</script>
</html>
The ... is irrelevant code.
Why isn't this working? Any ideas on how to fix it?
Thanks
Seems it working fine for me, but as I can see the only reason for the problem is the following.
Your page is loading piece by piece from up to down, so all the scripts are going to be included and executed one by one, all the elements are going to be shown one by one as well.
That's not this case in fact, because you are using "on click" event and there are no init actions, so it should be working, but you can try to move your <script></script> at the top (before you assign event).
<!DOCTYPE html>
<html>
<textarea name="Text1" cols="100"rows="20" id="textbox">
</textarea>
<script type="text/javascript">
you script here
</script>
<button onclick="run()">Export to C++</button>
</html>
You may also replace the whole code inside of
<script></script>
by something like alert("Hello"); to check if it's working. Possible you have the issue with internal code.

Why isn't this onclick JavaScript call working?

HTML
<div id="test"></div>
<input type="button" value="Go" onclick="test()" />
JavaScript
function test() {
alert("Test!");
}
Fiddle
http://jsfiddle.net/MVBrS/11/
Please look at this one, it is about jsfiddle code frames separation:
Inline event handler not working in JSFiddle
Of course, if you were running the same code embedded on plain HTML it works normally, having the alerted popup appearing.
<!DOCTYPE html>
<html>
<head>
<script>
function test() {
alert("Test!");
}
</script>
</head>
<body>
<div id="test"></div>
<input type="button" value="Go" onclick="test()" />
</body>
</html>
when you do
onclick="test()"
as an attribute of the input element, you are setting the result of the call test() (in your case 'null') as the click event handler
you probably want to do this
onclick="test"
instead, which will set the actual 'test' function as the handler,
or even better, follow the following guidelines: unbtrusive javascript or unobtrusive JS (2),.. you get the point ;)

JavaScript: Error "Object doesn't support this action"

The code for a counter gives an error
Whereas a similar snippet does not
I can't figure out any valid reason...
The line under consideration is:
<input type=button name="but2" value="stop" onClick="window.clearTimeout(ID);">
The complete code is:
<html>
<head>
<script language="JavaScript">
var counter=0;
ID=window.setTimeout("start();",2000);
function start()
{
counter++;
document.forms[0].elements[0].value=counter;
ID=window.setTimeout("start();",2000);
}
</script>
</head>
<body>
<form name="frm1">
<input type="text" name="timer1">
<input type="button" name="but1" value="start" onClick="counter=0; start();">
<input type=button name="but2" value="stop" onClick="window.clearTimeout(ID);">
</form>
</body>
</html>
Use window.start instead of start for the onClick event. It may be that IE doesn't create a window context when you use code instead of a function for the handler.
Everything about that code there is wrong. Please try to avoid that source of tutorials in the future.
Here is a working script: http://jsfiddle.net/teresko/qTJPx/
List of problem with your script:
missing doctype
language="JavaScript" is deprecated
variables ID and counter ended up in global scope
using html to attach events
incorrect use of setTimeout
<script> tag used in <head> when DOM is not ready yet
.. and i don't even want to go over that "similar snippet", it looks like something that by all rights should be dead an buried.
When you add your JavaScript code, it should be right before the closing </body> tag, because at that stage the DOM is already ready, but page has not begun to render yet.
I would strongly suggest for you to get some newer materials for learning JavaScript.
Hi I think in this line your getting the error
ID=window.setTimeout("start();",2000);
Right ?
Put this code
var ID=window.setTimeout("start();",2000);
you'll not get this JavaScript: Error Object doesn't support this action error.

Categories

Resources