Fiddle not working javascript [duplicate] - javascript

This question already has an answer here:
jsFiddle: no connection between html and js? Can't call simple function from button? [duplicate]
(1 answer)
Closed 8 years ago.
Why is the fiddle not printing in console:
HTML:
<input id="clickMe" type="button" value="clickme" onclick="validateEmail();" />
JavaScript
function validateEmail() {
console.log("ABC\n");
}
http://jsfiddle.net/amandeepautam/HKhw8/539/
Reference: Print Var in JsFiddle

Looks like there's an error in the script: "Uncaught ReferenceError: $ is not defined"
Seems you need to reference JQuery (its in "Frameworks & Extensions" dropdown)

Related

calc is not defined at HTMLbutton.onclick [duplicate]

This question already has answers here:
Why does this simple JSFiddle not work? [duplicate]
(8 answers)
Closed 3 years ago.
I am beginner to JS and receiving error on this code.
I could not make it work and getting this error:
calc is not defined at HTMLButtonElement.onclick
Searching different stackoverflow questions and other sources online
<form>
Value 1: <input type="text" id="value1"> Value 2: <input type="text" id="value2">
<br/> Operator:
<select id="operator">
<option value="add">Add</option>
</select>
<button type="button" onclick="calc()">Calculate</button>
</form>
<input type="text" id="result"/>
JS Code:
function calc(){
var n1 = parseInt(document.getElementById('value1').value);
var v2 = parseInt(document.getElementById('value2').value);
var op = document.getElementById('operator').value;
if(op === 'add'){
document.getElementById('result').value = n1+n2;
}
I am getting the error I shared above in console.
JSFiddle
You're getting that error because the calc function is not defined when the HTML is rendered, therefore the onclick instruction can't point to it. Later on, when the user clicks on the button, the JavaScript engine notices that you're trying to execute an undefined function and throws an error.
You can solve this by registering the event listener after you define the function in your script, for example with this line (though things would be much better if the button also had an id):
document.getElementsByTagName("button")[0].addEventListener("click", calc);
For reference, see https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

Clear a textarea via a button in javascript only [duplicate]

This question already has answers here:
Is "clear" a reserved word in Javascript?
(4 answers)
Why can't I call a function named clear from an onclick attribute?
(3 answers)
How to clear a textbox using javascript
(15 answers)
Closed 4 years ago.
I only know how to use Javascript and HTML5
I have tried so many ways to clear textarea but they won't work
<textarea id="texti" placeholder="Place Text Here Or Paste Text"></textarea>
<button class="button" type="button" onclick="clear()">CLEAR</button>
<script type="text/javascript">
function clear(){
document.getElementById("texti").innerHTML= "";
}
</script>
in the function part I have tried
document.getElementById("texti").value=0;
document.getElementById("texti").value="";
but apparently none of theme works in my code
End your textarea tag
Use .value
Do NOT use reserved words like clear
function clearIt() {
document.getElementById("texti").value = "";
}
<textarea id="texti" placeholder="Place Text Here Or Paste Text">XXX</textarea>
<button class="button" type="button" onclick="clearIt()">CLEAR</button>

javascript runs on w3schools.com but not on jsfiddle.net? [duplicate]

This question already has answers here:
Why this JSFiddle does not work [duplicate]
(1 answer)
jsFiddle: no connection between html and js? Can't call simple function from button? [duplicate]
(1 answer)
Closed 5 years ago.
ive used a basic example from w3schools.com to get here:
https://jsfiddle.net/02wu0v49/
function myFunction() {
var x = document.getElementById("fname").value;
document.getElementById("demo").innerHTML = "aaaaaa";
document.getElementById("fname").value = "bbbbb";
alert("lala3");
}
<body>
<p>A function is triggered when the user releases a key in the input field. The function outputs the actual key/letter that was released inside the text field.</p>
Enter your name: <input type="text" id="fname" onkeyup="myFunction()">
<p>My name is: <span id="demo"></span></p>
</body>
somehow the w3schools version works but it wont do anything on jsfiddle?
and it would be really nice to use [code][/code] or something to format code on stackoverflow...all those indents are terrible.
Change load type to No wrap in - <body>
Here is updated fiddle
Here is Docs
If you open the browser console in JS fiddle it lists the error. The HTML can't find the JS.

why object "this" work in first situation and doesn't work in another, why it "undefined" [duplicate]

This question already has answers here:
How does the "this" keyword work, and when should it be used?
(22 answers)
Closed 6 years ago.
first situation:
<span id="username" onclick="alert(this.innerHTML);">[Василий]</span>
after click on text "[Василий]" i see text in dialog window "[Василий]". OK. But in second situation when I'd written code below I saw "undefined", why?
<script type="text/javascript" charset="utf-8">
function func() {
alert(this.innerHTML);
}
</script>
<span id="username" onclick="func();">[Василий]</span>
Basically you have no reference to the object, you clicked on. You could take this as parameter and get the value in the function.
function func(t) {
alert(t.innerHTML);
}
<span id="username" onclick="func(this);">[Василий]</span>

Jquery code not running on test site [duplicate]

This question already has answers here:
Why is this jQuery click function not working?
(9 answers)
Closed 5 years ago.
Here is the sample of code that I've concentrating on. I've tried to incorporate it with my test site and the code doesn't work. I don't understand why, in both instances I'm using the latest version of Jquery (1.5) I'm using Google's hosted Api for my test site.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<script>
$('#name-label').dblclick(function() {
$("#name").val('some text');
});
</script>
<div class="ctrlHolder">
<label for="" id="name-label">Name</label>
<input name="name" id="name" type="text" class="textInput small" />
<p class="formHint">The name of the item you are submitting</p>
</div>
Does wrapping it in a $(document).ready(function() {}); work?
$(document).ready(function() {
$('#name-label').dblclick(function(){
$("#name").val('some text');
});
});
$(function() {
$('#name-label').dblclick(function(){
$("#name").val('some text');
});
}

Categories

Resources