Code tạo và lưu Thời Khóa Biểu bằng Javascrpit
📅 — 👀 1543 — 👦Có bạn hỏi mình muốn lưu thời khóa biểu trên Blogspot được không ? Mình trả lời luôn là được.
Cơ chế hoạt động như sau :
1/ Tạo mảng các tên các môn học.
2/ Kiểm tra nếu chưa có cookie arr_monhoc thì lưu vào, còn nếu có thì load mảng này ra.
Nói ra, thì với cách này, mỗi máy sẽ lưu vào arr_monhoc, còn nếu bạn muốn phát triển cho thêm nhiều người cùng dùng thì bình luận bên dưới, mình sẽ mổ xẻ cho các bạn.
Xem Demo:
Buổi sáng | |||||
THỨ 2 | THỨ 3 | THỨ 4 | THỨ 5 | THỨ 6 | THỨ 7 |
CODE:
<script>
/* Đây là plugin cookie */
(function(factory) {
if (typeof define === 'function' && define.amd) {
// AMD (Register as an anonymous module)
define(['jquery'], factory);
} else if (typeof exports === 'object') {
// Node/CommonJS
module.exports = factory(require('jquery'));
} else {
// Browser globals
factory(jQuery);
}
}(function($) {
var pluses = /+/g;
function encode(s) {
return config.raw ? s : encodeURIComponent(s);
}
function decode(s) {
return config.raw ? s : decodeURIComponent(s);
}
function stringifyCookieValue(value) {
return encode(config.json ? JSON.stringify(value) : String(value));
}
function parseCookieValue(s) {
if (s.indexOf('"') === 0) {
// This is a quoted cookie as according to RFC2068, unescape...
s = s.slice(1, -1).replace(/\"/g, '"').replace(/\\/g, '\');
}
try {
// Replace server-side written pluses with spaces.
// If we can't decode the cookie, ignore it, it's unusable.
// If we can't parse the cookie, ignore it, it's unusable.
s = decodeURIComponent(s.replace(pluses, ' '));
return config.json ? JSON.parse(s) : s;
} catch (e) {}
}
function read(s, converter) {
var value = config.raw ? s : parseCookieValue(s);
return $.isFunction(converter) ? converter(value) : value;
}
var config = $.cookie = function(key, value, options) {
// Write
if (arguments.length > 1 && !$.isFunction(value)) {
options = $.extend({}, config.defaults, options);
if (typeof options.expires === 'number') {
var days = options.expires,
t = options.expires = new Date();
t.setMilliseconds(t.getMilliseconds() + days * 864e+5);
}
return (document.cookie = [
encode(key), '=', stringifyCookieValue(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(''));
}
// Read
var result = key ? undefined : {},
// To prevent the for loop in the first place assign an empty array
// in case there are no cookies at all. Also prevents odd result when
// calling $.cookie().
cookies = document.cookie ? document.cookie.split('; ') : [],
i = 0,
l = cookies.length;
for (; i < l; i++) {
var parts = cookies[i].split('='),
name = decode(parts.shift()),
cookie = parts.join('=');
if (key === name) {
// If second argument (value) is a function it's a converter...
result = read(cookie, value);
break;
}
// Prevent storing a cookie that we couldn't decode.
if (!key && (cookie = read(cookie)) !== undefined) {
result[name] = cookie;
}
}
return result;
};
config.defaults = {};
$.removeCookie = function(key, options) {
// Must not alter options, thus extending a fresh object...
$.cookie(key, '', $.extend({}, options, {
expires: -1
}));
return !$.cookie(key);
};
}));
/* Kết thúc plugin cookie */
</script>
<table id='buoisang'>
<tr>
<td colspan='6' style='font-weight: bold;font-size: 30px;'>Buổi sáng</td>
</tr>
<tr>
<td>THỨ 2</td>
<td>THỨ 3</td>
<td>THỨ 4</td>
<td>THỨ 5</td>
<td>THỨ 6</td>
<td>THỨ 7</td>
</tr>
<script>
var html = "";
//Tạo môn học tự động trên table
var k = 1;
for (i = 0; i < 5; i++) {
for (var j = 0; j < 6; j++) {
html += "<td><input style='width:100%;' id='input" + k + "' type='text' value='Môn học " + i + j + "'/></td>";
k++;
}
html = "<tr>" + html + "</tr>";
}
//Tạo môn học tự động trên table
html += "<tr><td colspan='6' style='font-weight: bold;font-size: 30px;'>Buổi chiều</td></tr>";
for (i = 0; i < 5; i++) {
for (var j = 0; j < 6; j++) {
html += "<td><input style='width:100%;' id='input" + k + "' type='text' value='Môn học " + i + j + "'/></td>";
k++;
}
html = "<tr>" + html + "</tr>";
}
document.write(html);
//Kết thú ạo môn học tự động trên table
//Khai báo mảng môn học
var arr_monhoc = [];
//Kiểm tra cookie mảng môn học, nếu có thì load, còn không thì lưu mảng môn học mặc định
if (typeof $.cookie('arr_monhoc') === 'undefined') {
for (var i = 1; i < 61; i++) {
arr_monhoc.push($('#input' + i).val());
}
$.cookie('arr_monhoc', JSON.stringify(arr_monhoc), {
expires: 365
});
} else {
arr_monhoc = $.parseJSON($.cookie('arr_monhoc'));
$('table#buoisang input').each(function(i) {
$(this).val(arr_monhoc[i])
})
}
//Lưu mảng môn học khi click
function LuuMonHoc() {
$.removeCookie('arr_monhoc');
arr_monhoc = [];
for (var i = 1; i < 61; i++) {
arr_monhoc.push($('#input' + i).val());
}
$.cookie('arr_monhoc', JSON.stringify(arr_monhoc), {
expires: 365
});
alert("Đã lưu môn học thành công !");
}
</script>
</table>
<input type='button' value='Lưu thời khóa biễu' id='LuuTKB' onclick='LuuMonHoc();' />
📁 Code Demo