Jeg har en side med flere boksene. Jeg sjekke noen av dem og gå til neste side, når jeg kommer tilbake på denne siden, disse boksene må forbli sjekket som de var før du navigerer til en annen side. Trenger du å gjøre det med Javascript. Noen anelse ??
persistens av avmerkingsboksen verdier
stemmer
2
Publisert på 20/07/2009 klokken 15:28 2009-07-20 15:28
kilden bruker ShikhaScripts
På andre språk...
kilden bruker ShikhaScripts
På andre språk...
3 svar
stemmer 1
1
Du må vedvare dem mellom side-forespørsler. Du kan bruke økter eller informasjonskapsler til å gjøre dette. Hva type server du arbeider med, og med hva slags server-side språk?
Tidligere spørsmål om SO har adresse skriving / lesing cookies fra Javascript.
stemmer 4
4
Hvis du er begrenset til Javascript bare og ingen server side språk tror jeg du igjen for å lese / skrive cookies for å opprettholde staten. Som andre har referert, server side teknologier er mye bedre på dette, men hvis du må:
Javascript cookie eksempelkode (referanse: http://www.quirksmode.org/js/cookies.html ):
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function eraseCookie(name) {
createCookie(name,"",-1);
}
stemmer 0
0
Jeg tror ikke det er noen rimelig komplisert måte å gjøre det uten å ha noen tilgang til server-side kode, fordi på minimum du trenger å installere koden din og også identifisere HTML-kontroller for eksempel for å sjekke dem. Jeg er å gi rimelig kode som gjør hva du vil under.
Viktige notater:
- Koden krever at hver boksen er gitt et tydelig id attributt.
- Sjekken tilstand lagres i en informasjonskapsel kalt 'JS_PERSISTENCE_COOKIE'. Det ville være bedre å lagre navnet på denne informasjonskapselen i en variabel i stedet for hardcoding det i et par forskjellige steder som jeg har gjort. Hva slags variabel bør lagre navnet avhenger appen og krav.
- Det ville være bedre å pakke inn koden inne i et objekt i stedet for som en haug med gratis funksjoner som jeg har gjort. Men dette er ikke relevant for den opprinnelige spørsmålet.
- Etter å ha klikket noen boksene, kan du simulere "navigere tilbake til denne siden" ved å trykke CTRL + F5. F5 alene er ikke nok.
Her er koden og noen eksempler HTML for testing:
<body onload="restorePersistedCheckBoxes()">
<input type="checkbox" id="check1" onclick="persistCheckBox(this)" />
<input type="checkbox" id="check2" onclick="persistCheckBox(this)" />
<input type="checkbox" id="check3" onclick="persistCheckBox(this)" />
<input type="button" value="Check cookie"
onclick="alert(document.cookie)" />
<input type="button" value="Clear cookie"
onclick="clearPersistenceCookie()" />
<script type="text/javascript">
// This function reads the cookie and checks/unchecks all elements
// that have been stored inside. It will NOT mess with checkboxes
// whose state has not yet been recorded at all.
function restorePersistedCheckBoxes() {
var aStatus = getPersistedCheckStatus();
for(var i = 0; i < aStatus.length; i++) {
var aPair = aStatus[i].split(':');
var el = document.getElementById(aPair[0]);
if(el) {
el.checked = aPair[1] == '1';
}
}
}
// This function takes as input an input type="checkbox" element and
// stores its check state in the persistence cookie. It is smart
// enough to add or replace the state as appropriate, and not affect
// the stored state of other checkboxes.
function persistCheckBox(el) {
var found = false;
var currentStateFragment = el.id + ':' + (el.checked ? '1' : '0');
var aStatus = getPersistedCheckStatus();
for(var i = 0; i < aStatus.length; i++) {
var aPair = aStatus[i].split(':');
if(aPair[0] == el.id) {
// State for this checkbox was already present; replace it
aStatus[i] = currentStateFragment;
found = true;
break;
}
}
if(!found) {
// State for this checkbox wasn't present; add it
aStatus.push(currentStateFragment);
}
// Now that the array has our info stored, persist it
setPersistedCheckStatus(aStatus);
}
// This function simply returns the checkbox persistence status as
// an array of strings. "Hides" the fact that the data is stored
// in a cookie.
function getPersistedCheckStatus() {
var stored = getPersistenceCookie();
return stored.split(',');
}
// This function stores an array of strings that represents the
// checkbox persistence status. "Hides" the fact that the data is stored
// in a cookie.
function setPersistedCheckStatus(aStatus) {
setPersistenceCookie(aStatus.join(','));
}
// Retrieve the value of the persistence cookie.
function getPersistenceCookie()
{
// cookies are separated by semicolons
var aCookie = document.cookie.split('; ');
for (var i=0; i < aCookie.length; i++)
{
// a name/value pair (a crumb) is separated by an equal sign
var aCrumb = aCookie[i].split('=');
if ('JS_PERSISTENCE_COOKIE' == aCrumb[0])
return unescape(aCrumb[1]);
}
return ''; // cookie does not exist
}
// Sets the value of the persistence cookie.
// Does not affect other cookies that may be present.
function setPersistenceCookie(sValue) {
document.cookie = 'JS_PERSISTENCE_COOKIE=' + escape(sValue);
}
// Removes the persistence cookie.
function clearPersistenceCookie() {
document.cookie = 'JS_PERSISTENCE_COOKIE=' +
';expires=Fri, 31 Dec 1999 23:59:59 GMT;';
}
</script>
</body>