I’m trying to implement this in my code but I don’t know what is the matter. I searched a lot but I could not discover where is the problem in my code. Thank you in advance.
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js" />
<script type="text/javascript" src="jquery.watermark.js" />
</head>
<body>
<input type="text" width="300px" id="input">
<script type="text/javascript">
$("#input").watermark("Heee");
</script>
</body>
</html>
Update:
I have edited my code and still get this result:
My edited code:
<html>
<body>
<input type="text" width="300px" id="input">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js" />
<script type="text/javascript" src="jquery.watermark.js" />
<script type="text/javascript">
$("#input").watermark("Heee");
</script>
</body>
</html>
Make sure you always wrap your jQuery code around a document ready function, like this...
$(document).ready(function() {
$("#input").watermark("Heee");
});
Hi i tried with your code but i wont work, I added the head tag and use the ready function and now works well. I hope it helps. Regards
Regards
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="jquery.watermark.min.js"></script>
</head>
<script type="text/javascript">
$(document).ready(function() {
$('#inputId').watermark('Required information');
});
</script>
<body>
<input type="text" width="300px" id="inputId">
</body>
</html>
Related
I'm new to JavaScript and I'm getting this error. here below is my code:
<html>
<head>
<script type="text/javascript" src="jquery-3.4.1.min.js">
function hide() {
// some actions
}
</script>
</head>
<body>
<img id="myImgId" src="http://www.google.com/images/srpr/logo4w.png" onclick="hide()" style="position:absolute;opacity:0.5;left:50%;top:50%;width:50px;height:50px;margin-left:-25px;margin-top:-25px;z-index:100;"/>
</body>
What could be the problem?
Try below code
<html>
<head>
<script type="text/javascript" src="jquery-3.4.1.min.js" />
<script>
function hide() {
// some actions
}
</script>
</head>
<body>
<img id="myImgId" src="http://www.google.com/images/srpr/logo4w.png" onclick="hide()" style="position:absolute;opacity:0.5;left:50%;top:50%;width:50px;height:50px;margin-left:-25px;margin-top:-25px;z-index:100;"/>
</body>
Hey guys here is the answer but I dont know why should I write the script tag twice. Can someone explain?
<html>
<head>
<script type="text/javascript" src="jquery-3.4.1.min.js" ></script>
<script>
function hide() {
var imgElem = $("#myImgId" );
console.log("bastın");
imgElem.css({'display': 'none' })
}
</script>
</head>
<body>
<img id="myImgId" src="http://www.google.com/images/srpr/logo4w.png" onclick="hide()" style="position:absolute;opacity:0.5;left:50%;top:50%;width:50px;height:50px;margin-left:-25px;margin-top:-25px;z-index:100;"/>
</body>
<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"/>
<script type="text/javascript">
$(document).ready(function(){
$('#name').val('Name1');
});
function clickMe(){
console.log('click me called');
}
</script>
</head>
<body>
Person Name: <input type="text" id="name" data-bind="value:personName">
<input type="submit" value="Save" onClick="javascript:clickMe()"/>
</body>
</html>
In the code above neither the function inside document.ready is getting executed nor "clickMe" function is getting executed when "Save" button is clicked.
When I click on "Save" button, Uncaught ReferenceError: clickMe is not defined error message is seen.
Because you haven't closed script tag of jQuery. <script> is not self-closing tag.
<script type="text/javascript" src="https://code.jquery.com/jquery- 1.11.3.js"/>
Should be
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script>
Code:
<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#name').val('Name1');
});
function clickMe() {
alert('click me called');
}
</script>
</head>
<body>
Person Name:
<input type="text" id="name" data-bind="value:personName">
<input type="submit" value="Save" onClick="javascript:clickMe()" />
</body>
</html>
Scripts can not be self closing. You need to have the closing </script> tag on the jQuery include.
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"/>
needs to be
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script>
You need to refer to script like this:
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script>
Here is my HTML excerpt:
<html>
<head>
<script type="text/javascript" src="jquery.js">
</script>
<script type="text/javascript" src="alert_box.js">
</script>
<title></title>
</head>
<body>
<input type="button" id="name" value="click" >
</body>
</html>
Here's what's in my alert_box.js
$('#name').click(function(){
alert('alert box working');
});
Both JQuery and alert_box.js are imported
Based on the answers given, this should be solved. But I will summarize it. You may also want to just use a remote jquery script hosted somewhere else, which you can reference like so:
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
Otherwise...
<html>
<head>
//make sure your path here is correct
<script type="text/javascript" src="jquery.js"></script>
//make sure your path here is correct
<script type="text/javascript" src="alert_box.js"></script>
<title></title>
</head>
<body>
<input type="button" id="name" value="click" >
</body>
</html>
alert_box.js
(function() {
$('#name').click(function() {
alert('alert box working');
});
});
When you call that, the DOM isn't yet ready therefore, there is no #name element which you're looking for. Wrap your code in DOM ready like this
$(document).ready(function() {
$('#name').click(function() {
alert('alert box working');
});
});
Or bring the <script src="alert_box.js"> before </body>
Learn about DOM Ready
Now, after EternalHour provided me with an external JQuery source, some of the functionality resumed to normal. However, this would not work and I have no idea why:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="alert_box.js"></script>
<script type="text/javascript">
if(window.jQuery){ <!--this is a small test I ran ti see if jquery is loaded/-->
alert('jquery functional');
}else{
alert('jquery not loaded');
}
</script>
</head>
<body>
<input type="button" value="submit">
</body>
</html>
Now back to alert_box.js ...
$(window).ready(function(){
$(':button').click(function(){
$(this).attr('value','loading...');
});
});
The button won't change value, what's causing this?
Here is my code:
<html>
<head>
<script type="text/javascript" language="javascript" src="jquery-1.7.1.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
alert('hei');
});
</script>
</head>
<body>
<input type="button" id="btn" />
</body>
</html>
I'm getting an "object not supported" error on $(document).ready. I'm also getting this error: Uncaught SyntaxError: Unexpected token ILLEGAL
Your code seems to be correct, it looks like jQuery file is not loaded, verify that it has correct path.
This works:
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() { alert('hi'); });
</script>
</head>
<body>
</body>
</html>
In the following code how can I correctly insert the val testName defined in the function initialize() in the field Name in the body?
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>
<script type="text/javascript">
function intialize()
{
var testName="John";
}
</script>
</head>
<body onload="intialize()">
<input id="Name" type="textbox" value=testName>
</body>
</html>
You can use document ready :
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>
<script type="text/javascript">
$(function(){
$('#Name').val('testName');
});
</script>
</head>
<body>
<input id="Name" type="textbox" value=""/>
</body>
</html>
Used the id, Name, and set the value to 'testName' once the document is ready.
Well, if you're using jQuery, you could just include this in the function:
$("#Name").val(testval);
You might have to put the script in $(document).ready() though.
This. It's easy, and you don't have to worry about any of this jquery mess.
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>
<script type="text/javascript">
function intialize()
{
var testName="John";
document.getElementById("Name").value = testname;
}
</script>
</head>
<body onload="intialize()">
<input id="Name" type="textbox">
</body>
</html>
Try declaring it outside the function
<script type="text/javascript">
var testName;
function intialize()
{
testName="John";
}
</script>
But it will become a global variable.
You have jQuery available so USE it. Don't use an older version than 1.6.1 though..
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
var testName="John";
$(document).ready(function() {
$('#Name').val(testName);
});
</script>
</head>
<body>
<input id="Name" type="text">
</body>
</html>