i have this function which i define inside HEAD:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js">
function live() {
$.get("http://mydomain.com/script.php", function(data){
var timer = data;
var elm = document.getElementById("live");
if (timer == 1){
elm.style.display = 'block';
} else{
elm.style.display = 'none';
}
});
}
</script>
and then i do a loop like this at the very end of my document:
<script type="text/javascript">
setInterval(live,10000);
</script>
but i get an error saying live is not defined. Why is that? Could you please tell me what im doing wrong?
Thank you.
Put your code in an separate <script> tag. As soon as a <script> tag has a src attribute, any content of that tag is ignored in favor of the given resource. so just do this:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script>
function live() {
$.get("http://mydomain.com/script.php", function(data){
var timer = data;
var elm = document.getElementById("live");
if (timer == 1){
elm.style.display = 'block';
} else{
elm.style.display = 'none';
}
});
}
</script>
Related
Please I want to create a button that can be clicked only once in 24hrs in js but I don't really know how to put it up.
<html>
<head>
<title>Disable Button</title>
<script>
function doSomething () {
document.getElementById("myButton").disabled = true;
document.getElementById("myButton").disabled = false;}
</script>
</head>
<body>
<input type="button" id="myButton" onclick="doSomething()"
value="Click Here To Do Something"/>
</body>
</html>
window.onload = () => {
//on load of the page it will check for same day and disable/enable.
let lastclicked = localStorage.getItem('lastclicked') || '';
document.getElementById("myButton").disabled = lastclicked === new Date().toDateString();
}
function doSomething () {
localStorage.setItem('lastclicked', new Date().toDateString());
document.getElementById("myButton").disabled = true;
}
you need to save to date and time of the last trigger somewhere in local storage or cookies so next when the button is triggered it checked the date in storage if that exists then it will check the date.
hope so it will work for you.
var todayclick = true;
var buttonval = document.getElementById("myButton");
buttonval.click(function() {
if (todayclick ) {
alert("Error!");
}
else {
variable += 1;
todayclick = false;
}
setTimeout(function() {
todayclick = true;
}, 86400);
});
I'm a PLC programmer, i made a html page and i need it script refresh every second, so in my body i placed:
<body onload="changeimage()">
.... code ....
</body>
And the script:
<script>
setInterval(function changeimage() {
var sonde = ["Sonda1","Sonda2","Sonda3","Sonda4"];
var tsonde = ["tsonda1","tsonda2","tsonda3","tsonda4"];
var temperature = [:="OUTPUT".AlarmTemp.Sonda1:,:="OUTPUT".AlarmTemp.Sonda2:,:="OUTPUT".AlarmTemp.Sonda3:,:="OUTPUT".AlarmTemp.Sonda4:];
var hotcold = document.getElementById("Fiocco");
if (:="OUTPUT".Stagione.Estate: > 0){
hotcold.src="sun.jpg"}
if (:="OUTPUT".Stagione.Inverno: > 0){
hotcold.src="Neve.png"}
for (x in temperature) {
var icona = document.getElementById(sonde[x]);
if (temperature[x] > 0 ){
icona.src="Paverde.png"
}
else{
icona.src="Parossa.png"
}
}
}, 1000);
</script>
Anyway i get the error:
ReferenceError: changeimage is not defined
P.S.: Don't get fooled by the arrays who start with ":", is a PLC syntax, is correct.
# Even removing the setinterval option, the script is not working.
Define the function first and make sure the script is loaded.
Example in code pen: https://codepen.io/mikila85/pen/NWPvQPE
function changeimage() {
setInterval(function() {
var sonde = ["Sonda1","Sonda2","Sonda3","Sonda4"];
var tsonde = ["tsonda1","tsonda2","tsonda3","tsonda4"];
var temperature = [:="OUTPUT".AlarmTemp.Sonda1:,:="OUTPUT".AlarmTemp.Sonda2:,:="OUTPUT".AlarmTemp.Sonda3:,:="OUTPUT".AlarmTemp.Sonda4:];
var hotcold = document.getElementById("Fiocco");
if (:="OUTPUT".Stagione.Estate: > 0){
hotcold.src="sun.jpg"
}
if (:="OUTPUT".Stagione.Inverno: > 0){
hotcold.src="Neve.png"
}
for (x in temperature) {
var icona = document.getElementById(sonde[x]);
if (temperature[x] > 0 ){
icona.src="Paverde.png"
}
else{
icona.src="Parossa.png"
}
}
}, 1000);
}
Anyway i get the error: ReferenceError: changeimage is not defined
setInterval(function changeimage() {
Sure it won't be defined, as it was only defined as a callback function to the setInterval() call.
So it won't be visible outside of this setInterval scope, and it won't be visible for the onload event listener of your body.
Solution:
You should define your changeimage() function in the global scope (outside of the setInterval like this:
<head>
<script>
function changeimage() {
var sonde = ["Sonda1", "Sonda2", "Sonda3", "Sonda4"];
var tsonde = ["tsonda1", "tsonda2", "tsonda3", "tsonda4"];
var temperature = [: = "OUTPUT".AlarmTemp.Sonda1: ,: = "OUTPUT".AlarmTemp.Sonda2: ,: = "OUTPUT".AlarmTemp.Sonda3: ,: = "OUTPUT".AlarmTemp.Sonda4: ];
var hotcold = document.getElementById("Fiocco");
if (: = "OUTPUT".Stagione.Estate: > 0) {
hotcold.src = "sun.jpg"
}
if (: = "OUTPUT".Stagione.Inverno: > 0) {
hotcold.src = "Neve.png"
}
for (x in temperature) {
var icona = document.getElementById(sonde[x]);
if (temperature[x] > 0) {
icona.src = "Paverde.png"
} else {
icona.src = "Parossa.png"
}
}
}
setInterval(changeimage(), 1000);
</script>
</head>
<body onload="changeimage()">
.... code ....
</body>
You can see it working in this Demo.
Note:
Make sure to place your script tag in the head of your HTML page before the body tag so it can be accessed in the onload event listener.
try this
function changeImage(){
....
}
// if you need to call every 1 sec
setInterval(changeImage,1000);
// else
changeImage(); or // setTimeout(changeImage,1000)
Long story short i need to edit a textarea after it was created by a wordpress plugin, i can set the id and default value, but i can't set events or anything else, i want the default value to disappear after the user clicks to enter the phone number.
I have tried several ways of doing this without luck, some are:
<script type="text/javascript">
$(document).ready(function(){
// Your code goes here
function clearOnInitialFocus ("telid01") {
var clearedOnce = false;
document.getElementById("telid01").onfocus = (function () {
if (clearedOnce == false) {
this.value = '';
clearedOnce = true;
}
})
}
window.onload = function() { clearOnInitialFocus('telid01');}
});
</script>
Also tried
<script type="text/javascript">
$(document).ready(function(){
document.getElementById('telid01').addEventListener('focus', function() {
this.value = "";
});
});
</script>
this works in the console but not on page load:
document.getElementById('telid01').addEventListener('focus', function() {
this.value = "";
Since you're using jQuery, you may as well use jQuery's event binding, like so:
$(document).ready(function(){
var clearedOnce = false;
$(this).on('focus', '#telid01', function () {
if (!clearedOnce) {
$(this).val('');
clearedOnce = true;
}
});
});
Edit: If you attach the event to 'document' then pass the id as a selector to on() it should work, and should be able to attach the event even without the field existing on the page yet. See: http://api.jquery.com/on/
You are using function parameters in a strange way.
I've tried the following code that is based on yours and it works fine.
<!doctype html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// Your code goes here
var clearedOnce = false;
document.getElementById("myTest").onfocus =
function () {
if (clearedOnce == false) {
this.value = '';
clearedOnce = true;
}
};
});
</script>
</head>
<body>
<input id="myTest" value="placeholder" />
</body>
</html>
I have the following very simple code:
<html>
<head>
<script type="text/javascript" >
function showAlert(){
alert("I am clicked");
}
function one(){
var a1 = [1,2,3];
for (var i=0;i<a1.length;i++) {
var p = document.createElement('p');
p.innerHTML = a1[i];
p.onclick = showAlert;
document.body.appendChild(p);
}
console.log("I am called");
}
one();
</script>
</head>
</html>
I am getting the following error:Uncaught TypeError: Cannot read property 'appendChild' of null. Can anybody tell me, where am I going wrong? I am testing in Chrome.
document.body.appendChild is run before the body is defined, hence document.body is still null.
Either move this script down under the <body></body> or delay it's execution with:
window.addEventListener("load", function () { /* we're ready */ });
document.body.appendChild(p)
In this line. Some days ago I had the same problem.
This happens if you put your script before of the tag body.
<html>
<head>
<script type="text/javascript" >
function showAlert(){
alert("I am clicked");
}
function one(){
var a1 = [1,2,3];
for (var i=0;i<a1.length;i++) {
var p = document.createElement('p');
p.innerHTML = a1[i];
p.onclick = showAlert;
document.body.appendChild(p);
}
console.log("I am called");
}
one();
</script>
</head>
</html>
Will not work.
If you put your function call after the tag it works.
<html>
<head>
<script>
function showAlert(){
alert("I am clicked");
}
function one(){
var a1 = [1,2,3];
for (var i=0;i<a1.length;i++) {
var p = document.createElement('p');
p.innerHTML = a1[i];
p.onclick = showAlert;
document.body.appendChild(p);
}
console.log("I am called");
}
</script>
</head>
<body>
<body>
<script type="text/javascript" >
one();
</script>
</html>
In your context, "body" yet didn't be initialized, so it is null
It looks like you are missing the body tag from your HTML. So document.body is null
Some of the javascripts on this site: http://www.bristolhotel.com/pizzeria/onlinepizza3.php doesn't work in Firefox. What's the problem?
<script language="JavaScript">
function OpenDiv(popUpDiv){
popUpDiv.style.display="block";
window.setTimeout("Hide();", 2000);
}
function OpenDiv(blanket){
blanket.style.display="block";
window.setTimeout("Hide();", 2000);
}
function Hide() {
document.getElementById('popUpDiv').style.display='none'
document.getElementById('blanket').style.display='none'
}
</script>
<script language="JavaScript">
function OpenCloseDiv(divName) {
if (divName.style.display == "none") {
divName.style.display="block";
} else {
divName.style.display="none";
}
}
</script>
The code you provided isn't actually the problem.
If you look at the error console (I'm assuming you didn't), you'll see errors like "nr11 not defined". And this is why :
<a onclick="OpenCloseDiv(nr11)"
I don't know where you have the variable nr11 defined, but you'll probably want to make it a string: "nr11" instead.
try to change window.setTimeout("Hide();", 2000); to window.setTimeout(Hide, 2000);
I changed the code to this:
<script type="text/javascript">
function OpenCloseDiv(divName){
var div = document.getElementById(divName);
if (div.style.display == "none") {
div.style.display="block";
}
else {
div.style.display="none";
}
}
</script>
<script type="text/javascript">
function OpenDiv(popUpDiv){
var div = document.getElementById(popUpDiv);
div.style.display="block";
window.setTimeout("Hide();", 2000);
}
function OpenDiv(blanket){
var div = document.getElementById(blanket);
div.style.display="block";
window.setTimeout("Hide();", 2000);
}
function Hide()
{
document.getElementById('popUpDiv').style.display='none'
document.getElementById('blanket').style.display='none'
}
</script>
and then added "" ( ) and it seems to work now. :)
Thank you for all your help! Really appreciate it!