[英]Including Unchecked State in JQuery
因此,我不是程序員,但我可以理解並可以很好地遵循指示。
我實現了一些在JSfiddle上找到的JS,以保存復選框的狀態,並且效果很好。 您檢查它,它在刷新時保持選中狀態。
但問題是,如果您取消選中某個框並刷新,則會重新檢查它。 這是我使用的小提琴: JS小提琴,用於保存Cookie的檢查狀態
//===== Cookies Plugin===== //
(function ($) {
$.cookie = function (key, value, options) {
// key and at least value given, set cookie...
if (arguments.length > 1 && (!/Object/.test(Object.prototype.toString.call(value)) || value === null || value === undefined)) {
options = $.extend({}, options);
if (value === null || value === undefined) {
options.expires = -1;
}
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
value = String(value);
return (document.cookie = [
encodeURIComponent(key), '=', options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// key and possibly options given, get cookie...
options = value || {};
var decode = options.raw ? function (s) { return s; } : decodeURIComponent;
var pairs = document.cookie.split('; ');
for (var i = 0, pair; pair = pairs[i] && pairs[i].split('='); i++) {
if (decode(pair[0]) === key) return decode(pair[1] || ''); // IE saves cookies with empty string as "c; ", e.g. without "=" as opposed to EOMB, thus pair[1] may be undefined
}
return null;
};
})(jQuery);
//======================================//
$(document).ready(function () {
var checkbox = $('#boxlawreg').find(':checkbox'), checkboxCookieName = 'checkbox-state';
checkbox.each(function () {
$(this).attr('checked', $.cookie(checkboxCookieName + '|' + $(this).attr('name')));
});
checkbox.click(function () {
$.cookie(checkboxCookieName + '|' + $(this).attr('name'), $(this).prop('checked'));
});
});
有人可以協助如何使其在已檢查和未檢查狀態下工作嗎?
工作中的某人通過給我這個代碼來幫助我,該代碼可以正常工作(請注意Input類)
// Avoid scoping issues by encapsulating code inside anonymous function
(function() {
// variable to store our current state
var cbstate;
// bind to the onload event
window.addEventListener('load', function() {
// Get the current state from localstorage
// State is stored as a JSON string
cbstate = JSON.parse(localStorage['CBState'] || '{}');
// Loop through state array and restore checked
// state for matching elements
for(var i in cbstate) {
var el = document.querySelector('input[name="' + i + '"]');
if (el) el.checked = true;
}
// Get all checkboxes that you want to monitor state for
var cb = document.getElementsByClassName('save-cb-state');
// Loop through results and ...
for(var i = 0; i < cb.length; i++) {
//bind click event handler
cb[i].addEventListener('click', function(evt) {
// If checkboxe is checked then save to state
if (this.checked) {
cbstate[this.name] = true;
}
// Else remove from state
else if (cbstate[this.name]) {
delete cbstate[this.name];
}
// Persist state
localStorage.CBState = JSON.stringify(cbstate);
});
}
});
})();
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.