开发者

JavaScript Date and browser version function

I can't seem to get this code working. Im trying to make it so that if the browser is IE6 or lower it will use "horarios2.png" for the img src and no other. And if its any other browser that it will check the weekday(0-6) so that it will fill in the specific image for each day. From Monday(1) to Wensday(3) the image is suposed to be "quarta.png". The other day's have their own image. They work seperatly but when I try and put them together I get in trouble and it dosen't render the image.

Script

$(document).ready (function horario () {
var date = new Date();
var weekday = (date.getDay());

function (msieversion) {
var ua = window.navigator.userAgent
var msie = ua.indexOf ( "MSIE " )

if ( msie > 0 )
     return parseInt (ua.substring (msie+5, ua.indexOf (".", msie )))
else
     return 0
}
if ((msieversion() == 0 )&&(weekday==0)) {
    document.getElementById('horarios').src = "i开发者_JS百科mg/domingo.png";}
else if ((msieversion() == 0 )&&(weekday==4)) {
    document.getElementById('horarios').src = "img/quinta.png";}
else if ((msieversion() == 0 )&&(weekday==5)) {
    document.getElementById('horarios').src = "img/sexta.png";}
else if ((msieversion() == 0 )&&(weekday==6)) {
    document.getElementById('horarios').src = "img/sabado.png";}
else if((msieversion() <= 6 )&&(weekday>=0)) {
    document.getElementById('horarios').src = "img/horarios2.png";}
else {
    document.getElementById('horarios').src = "img/quarta.png";}
});

HTML

<img id="horarios" border="0" alt="" width="343" height="45" />


Here is what I think you meant DEMO HERE (mouseover the image)

function msieversion() {  
  var ua = window.navigator.userAgent
  var msie = ua.indexOf("MSIE ");
  return (msie == -1)?0: 
      parseInt(ua.substring (msie+5, ua.indexOf (".", msie )))
}
function getImg(idx) {
  return [
  "img/domingo.png",
  "img/quarta.png",
  "img/quarta.png",
  "img/quarta.png",
  "img/quinta.png",
  "img/sexta.png",
  "img/sabado.png"
  ][idx];
}
$(document).ready(function() {
  var weekday = new Date().getDay();
  if (msieversion() == 0 ) $("#horarios").attr("src",getImg(weekday));
  else $("#horarios").attr("src",(msieversion() <= 6 )? "img/horarios2.png":"img/quinta.png");
});


Your code can be refined more.

But before that, you may want to use the "official" way of detecting the version of IE: (From Detecting Internet Explorer More Effectively)

function getInternetExplorerVersion()
// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
{
  var rv = -1; // Return value assumes failure.
  if (navigator.appName == 'Microsoft Internet Explorer')
  {
    var ua = navigator.userAgent;
    var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
    if (re.exec(ua) != null)
      rv = parseFloat( RegExp.$1 );
  }
  return rv;
}

Now, lets work on the logic:

  • If the browser is IE6 or lower it will use "horarios2.png" for the img src and no other.
  • And if its any other browser that it will check the weekday(0-6) so that it will fill in the specific image for each day.
    • From Monday(1) to Wensday(3) the image is suposed to be "quarta.png".
    • The other day's have their own image

:

function horario ()  {
   var imageName = "";
   if(getInternetExplorerVersion() <= 6) {
      imageName = "img/horarios2.png";
      return;
   }

   var date = new Date();
   var weekday = (date.getDay());
   switch(weekday)
   {
      case 0:
          imageName = "img/domingo.png";
          break;
      case 1:
      case 2:
      case 3:
          imageName = "img/quarta.png";
          break;
      case 4:
          imageName = "img/quinta.png";
          break;
      case 5:
          imageName = "img/sexta.png";
          break;
      case 6:
          imageName = "img/sabado.png";
          break;
      default:
          imageName = "img/horarios2.png";
   }
   document.getElementById('horarios').src = imageName;
}


You can take a page from the html5boilerplate (this example doesn't require any html5 specific parts) where you use the [if IE] proprietary markup to detect IE version, then read from the <html> element's className in javascript

jsfiddle example

HTML:

<!--[if lt IE 7]> <html lang="en-us" class="no-js ie6"> <![endif]--> 
<!--[if IE 7]>    <html lang="en-us" class="no-js ie7"> <![endif]--> 
<!--[if IE 8]>    <html lang="en-us" class="no-js ie8"> <![endif]--> 
<!--[if gt IE 8]><!--> <html lang="en-us" class="no-js"> <!--<![endif]--> 

JavaScript:

var htmlElement = document.getElementsByTagName('html')[0],
    horariosImg = document.getElementById('horarios'),
    imgSrc = '';

if (htmlElement.className.indexOf('ie6') > -1) {
    // do ie 6 (and lower) stuff
    imgSrc = 'img/horarios2.png';
} else {
    // do all other browser stuff
    switch ((new Date).getDay()) {
        case 0: // Sun
            imgSrc = 'img/domingo.png';
            break;
        case 1: // Mon
        case 2: // Tues
        case 3: // Wed
        case 4: // Thurs
            imgSrc = 'img/quinta.png';
            break;
        case 5: // Fri
            imgSrc = 'img/sexta.png';
            break;
        case 6: // Sat
            imgSrc = 'img/sabado.png';
            break;
    }
}
horariosImg.src = imgSrc;
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜