Ich habe eine Seite mit mehreren Kontrollkästchen. Ich überprüfe ein paar von ihnen und auf die nächste Seite gehen, wenn ich auf dieser Seite zurückkommen, diese Kontrollkästchen aktiviert bleiben müssen, da sie auf eine andere Seite, bevor die Navigation waren. Du möchtest mit Javascript tun. Irgendeine Ahnung??
Persistenz der Kontrollkästchen Werte
stimmen
2
Veröffentlicht am 20/07/2009 um 16:28 2009-07-20 16:28
quelle vom benutzer ShikhaScripts
In anderen Sprachen...
quelle vom benutzer ShikhaScripts
In anderen Sprachen...
3 antworten
stimmen 1
1
Sie müssen sie zwischen Seite-Anfragen bestehen bleiben. Sie können Sitzungen oder Cookies verwenden, dies zu tun. Welche Art von Server arbeiten Sie, und mit welcher Art von Server-Side-Sprache?
Zurück Fragen auf SO-Adresse schriftlich haben / Cookies von JavaScript zu lesen.
stimmen 4
4
Wenn Sie nur und keine Server-Seite Sprache JavaScript beschränkt sind glaube ich Sie / Schreiben von Cookies zu lesen sind links, um den Zustand zu halten. Wie andere verwiesen haben, sind serverseitige Technologien viel besser, aber wenn es sein muss:
JavaScript Cookie Beispielcode (Referenz: 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);
}
stimmen 0
0
Ich glaube nicht , dass es keine vernünftigerweise komplizierte Art und Weise , es zu tun , ohne dass Zugriff auf den serverseitigen Code ist, weil bei den minimal Sie müssen Ihren Code installieren und den HTML - Steuerelemente zB zu identifizieren , um sie zu überprüfen. Ich bin zu geben vernünftigen Code, der tut , was Sie unten wollen.
Wichtige Notizen:
- Der Code erfordert , dass jedes Kästchen ein eindeutiges ID - Attribut gegeben ist.
- Der Check-Zustand wird in einem Cookie namens ‚JS_PERSISTENCE_COOKIE‘ gespeichert. Es wäre besser, den Namen dieses Cookie zu speichern, in einer Variablen, anstatt sie in ein paar verschiedenen Orte zu wie ich getan habe. Welche Art von Variable sollte den Namen speichert, hängt von Ihrer Anwendung und Anforderungen.
- Es wäre besser, den Code innerhalb eines Objekts zu verpacken, anstatt als Reihe von kostenlosen Funktionen wie ich getan habe. Dies ist jedoch auf Ihre erste Frage nicht relevant.
- Nach ein paar Kontrollkästchen aktivieren, können Sie „Navigation zurück zu dieser Seite“ durch das Drücken STRG + F5 simulieren. F5 allein ist nicht genug.
Hier ist der Code und einige Beispiel-HTML für die Prüfung:
<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>