问题
I've been struggling with this all morning and finally I've decided to ask for help. I have a datepicker (of jquery ui) which I populate with events from google calendar and change the classes accordingly. I used the beforeShowDay function of the datepicker with good results so far. Unfortunately, the calendar events are written in spanish, so I got rid of all the accented characters in the beforeShowDay function using another function (following code):
function accentsTidy(s){
var r = s.toLowerCase();
non_asciis = {'a': '[àáâãäå]', 'ae': 'æ', 'c': 'ç', 'e': '[èéêë]', 'i': '[ìíîï]', 'n': 'ñ', 'o': '[òóôõö]', 'oe': 'œ', 'u': '[ùúûűü]', 'y': '[ýÿ]'};
for (i in non_asciis) { r = r.replace(new RegExp(non_asciis[i], 'g'), i); }
return r;
};
The problem is I can't get IE 11 to work with this function. (It doesn't replace any of the accented characters) so I decided to do it differently and added this line:
if (isIE) {
$('td[class*="Highlighted"]').not('td[class*="Unknown"]').each(function (index) { $(this).addClass($(this).attr('class').replace(/[áéíóúñäëïöü]/gi, 'x')); });
}
and previously I defined the function to check if it is Internet Explorer 11:
function isIE() { return ((navigator.appName == 'Microsoft Internet Explorer') || ((navigator.appName == 'Netscape') && (new RegExp("Trident/.*rv:([0-9]{1,}[\.0-9]{0,})").exec(navigator.userAgent) != null))); }
However no matter where in the code I place the line in question (the one that adds the classes, it doesn't add anything. I know it may be because I'm adding that line somewhere where the scope may be wrong, so I've tried changing from $(document).ready(function(){ to $(function() to no avail. I've also placed that line of code almost anywhere I can think of, for example in the click event that is fired when some checkboxes are clicket (which are the ones responsible of showing the events in the calendar), again to no avail, for example, putting that line of code at the end of the following was unsuccesfull:
$('input:checkbox').live('click', function () {
validaObjeto($(this));
//I've tried putting it here
});
Currently I have it in here (inside the function that is called on the click event:
function validaObjeto(elem){
if (elem.val() != "semestre") {
if (elem.val().indexOf(",") == -1) {
var identificador = $(elem).val();
var request = gapi.client.calendar.events.get({ 'calendarId': 'cide.edu_sm151i2pdhu2371vq8hamcver4@group.calendar.google.com', 'eventId': identificador });
request.execute(function (resp) {
var dateIni = new Date(resp.start.date);
var dateFin = new Date(resp.end.date);
diasperiodo = dateFin.getDate() - dateIni.getDate();
for (i = 0; i <= diasperiodo; i++) {
datekey = new Date();
console.log(new Date(datekey.setTime(dateIni.getTime() + i * 86400000)));
if ($(elem).is(":checked")) {
todosEventos[$.datepicker.formatDate('yy-mm-dd', new Date(datekey.setTime(dateIni.getTime() + i * 86400000)))] = { 'summary': resp.summary, 'start': new Date(resp.start.date), 'end': new Date(resp.end.date) };
}
else {
delete todosEventos[$.datepicker.formatDate('yy-mm-dd', new Date(datekey.setTime(dateIni.getTime() + i * 86400000)))];
}
}
$('#cal').datepicker("refresh");
if (isIE) {
$('td[class*="Highlighted"]').not('td[class*="Unknown"]').each(function (index) { $(this).addClass($(this).attr('class').replace(/[áéíóúñäëïöü]/gi, 'x')); });
}
});
}
else {
evts = $(elem).val().split(",");
for (i = 0; i < evts.length; i++) {
var identificador = evts[i];
var request = gapi.client.calendar.events.get({ 'calendarId': 'cide.edu_sm151i2pdhu2371vq8hamcver4@group.calendar.google.com', 'eventId': identificador });
request.execute(function (resp) {
var dateIni = new Date(resp.start.date);
var dateFin = new Date(resp.end.date);
diasperiodo = dateFin.getDate() - dateIni.getDate();
for (i = 0; i <= diasperiodo; i++) {
datekey = new Date();
console.log(new Date(datekey.setTime(dateIni.getTime() + i * 86400000)));
if ($(elem).is(":checked")) {
todosEventos[$.datepicker.formatDate('yy-mm-dd', new Date(datekey.setTime(dateIni.getTime() + i * 86400000)))] = { 'summary': resp.summary, 'start': new Date(resp.start.date), 'end': new Date(resp.end.date) };
}
else {
delete todosEventos[$.datepicker.formatDate('yy-mm-dd', new Date(datekey.setTime(dateIni.getTime() + i * 86400000)))];
}
}
$('#cal').datepicker("refresh");
if (isIE) {
$('td[class*="Highlighted"]').not('td[class*="Unknown"]').each(function (index) { $(this).addClass($(this).attr('class').replace(/[áéíóúñäëïöü]/gi, 'x')); });
}
});
}
}
}
else {
if ($(elem).is(":checked")) {
var inicioDeClases, finDeClases;
var request = gapi.client.calendar.events.get({ 'calendarId': 'cide.edu_sm151i2pdhu2371vq8hamcver4@group.calendar.google.com', 'eventId': 'hhq29qmmaeql9ne810q3s0pips' });
request.execute(function (resp) {
inicioDeClases = new Date(resp.start.date);
});
var peticion = gapi.client.calendar.events.get({ 'calendarId': 'cide.edu_sm151i2pdhu2371vq8hamcver4@group.calendar.google.com', 'eventId': '52p6lv5qgmal7t1ibb2u3rbn84' });
peticion.execute(function (resp) {
finDeClases = new Date(resp.end.date);
unEvento = { 'summary': 'Semestre de clases', 'start': inicioDeClases, 'end': finDeClases };
$('#cal').datepicker("refresh");
});
}
else {
unEvento = null;
$('#cal').datepicker("refresh");
}
}
}
To no avail. Strange thing is if I place an alert before the line of code that is supposed to add the class, it shows the alert (almost in every place where I've put that line, I can't remember exactly where right now). And of course if I run the line from the developer's console, it does change the classes as it is supposed to.
So I guess the question is: ¿where on earth is that line supposed to be for it to work?
Or maybe someone can point out a reason why the accentsTidy function doesn't work in Internet Explorer?
回答1:
I know this is an old post, but I wanted to tell the solution I came up to, using this library: phpjs and the functions utf8_encode and utf8_decode I made IE behave, the problem was that due to the encoding of the server, or the browser, I never figured out the actual reason, the characters were being incorrectly encoded (only in IE), but calling those functions before passing them solved the problem.
来源:https://stackoverflow.com/questions/27410988/cant-add-class-with-jquery-to-datepicker