Javascript动态地将对象推入不在Firefox/IE中工作的阵列

这是有点牵扯，我会尽量做到尽可能清楚。我还会首先说明这是按照Chrome和IE以后版本的预期工作的，但不是在Firefox或较旧的IE中，这是我的问题的主要内容。Javascript动态地将对象推入不在Firefox/IE中工作的阵列

我已经添加了一个jquery datepicker日历的页面上有一个事件的列表。每个事件都有一个名称，表明它们的日期，并且所有的CSS类都有“列表”。我创建了一个使用getElementsByClassName（“listing”）获取所有这些事件的数组（列表）。然后我创建了另一个数组（事件）并遍历'listing'中的所有元素，将一个对象推入为datepicker格式化的新数组的每个元素。然后我在datepicker'beforeShowDay'函数中使用这个数组（事件）来突出显示/链接所有有事件的日期。

此外，这在Chrome和更新的IE，但不是Firefox（日期选择器显示，但没有突出显示日期）或较旧的IE版本（日期选择器日历不显示）很好。有关如何让它在所有浏览器上工作的想法？

这里是我的代码：

$(document).ready(function() { 

    var listing = document.getElementsByClassName("listing"); 
    var events = new Array(); 

    for (var i = 0; i < listing.length; i++) { 
     // something wrong with this line...? 
     events.push({Title : listing[i].getAttribute("name"), Date: new Date(listing[i].getAttribute("name"))}); 
    } 
    $("#calendar").datepicker({ 
     beforeShowDay: function(date) { 
      var result = [false, '', null]; 
      var matching = $.grep(events, function(event) { 
       return event.Date.valueOf() === date.valueOf(); 
      }); 

      if (matching.length) { 
       result = [true, 'highlight', null]; 
      } 
      return result; 
     }, 
     onSelect: function(dateText) { 
      var selectedDate = new Date(dateText); 
     var day = selectedDate.getDate(); 
     var month = selectedDate.getMonth() + 1; 
     var year = selectedDate.getFullYear(); 
     location.hash = "#" + month + "-" + day + "-" + year; 
     //alert(month + "-" + day + "-" + year); 
     } 
    }); 

});

有一两件事我注意到的是，如果我替换for循环与每个值的显式定义产生的“事件”阵列将在Firefox，但仍然工作不是老年人的IE。

换句话说更换此：

for (var i = 0; i < listing.length; i++) { 
     events.push({Title : listing[i].getAttribute("name"), Date: new Date(listing[i].getAttribute("name"))}); 
    };

有了这个：

var events = [ 
     { Title: "Event 1", Date: new Date("9/12/2012") }, 
     { Title: "Event 2", Date: new Date("9/25/2012") }, 
     { Title: "Event 3", Date: new Date("9/29/2012") } 
    ];

在此先感谢您的帮助，还没有得到任何运气找到答案的任何地方。

编辑*：
改变到$(".listing");在目前IE所有版本的伟大的工作（getElementsByClassName不能在IE < 9工作）。仍然没有日期在FF中突出显示。我在FF控制台中看到的唯一错误属于不相关的CSS和prettyPhoto/slideshow js，不认为这些与这个问题有关.. ..？

编辑*：
不知道我是否应该更换我原来的问题的内容或附加，如果我在做这个道歉太长时间......继续尝试不同的事情，仍然没有运气。除FF以外的所有浏览器中，一切正常，日历弹出正常，但没有事件日期突出显示/链接。我试图明确填充'事件'数组而不是迭代推入它，这工作正常。似乎迭代推动部分是FF中不起作用的部分。

换句话说，替换此：

var events = []; 
    for (var i = 0; i < listing.length; i++) { 
     events.push({Title : listing[i].getAttribute("name"), Date: new Date(listing[i].getAttribute("name"))}); 
    }

随着这样的：在FF

var events = [ 
     { Title: "Event 1", Date: new Date("9/20/2012") }, 
     { Title: "Event 2", Date: new Date("9/27/2012") }, 
     { Title: "Event 3", Date: new Date("10/4/2012") } 
    ];

工作正常。有没有人看到上面的for循环有什么问题？再次感谢您的任何见解...

来源

2012-09-19 washe

请打开FF中的控制台，并在那里查找错误。如果您发现任何错误，请将其添加到您的问题描述中。 'for'循环的大括号之后也不需要分号。 –

首先想到的是，如果您使用的是jQuery，那么请停止使用JavaScript。例如：'var listing = document.getElementsByClassName（“listing”）; '应该只是'var listing = $（“。listing”）;' – SpYk3HH

是否有可能保留“events”？尝试另一个变量名称。 – weexpectedTHIS

好吧，花了很多摆弄，但发现问题。最终很愚蠢，但现在我知道了。很显然FF在用破折号将new Date()丢在它上面时会出现问题，但它适用于斜杠。所以我的主要错误（我原来在帖子中应该更具体一些，道歉）在每个事件元素的名称标签中使用格式“MM-DD-YYYY”。我将每个事件元素的名称标签更改为“MM/DD/YYYY”格式，更新了链接功能以反映这一点，并且现在所有测试的浏览器都可以正常工作（Chrome，IE 9，IE < 9，FF ）。

感谢您的所有建议，绝对帮助我找到最终解决方案。

来源

2012-09-20 20:50:14 washe

Javascript动态地将对象推入不在Firefox/IE中工作的阵列

回答

相关问题