IE JS 兼容性 - 在 FF 中工作?
以下代码在 FireFox 中按预期显示,但在 Internet Explorer (v8) 中根本不显示。
// getLimits init
Frog.API.get('users.getInfo',
{
'params': {'id': UWA.Environment.user.id, 'details':'groups' },
'onSuccess': AssignPoints.getLimit,
'onError': function(err) { alert(err); }
});
...
// work out the user's limit, and how many points they've spent this week
// use LEAP library if necessary
AssignPoints.getLimit = function(data) {
for (var i in data[0].groups) {
if (data[0].groups[i].name.indexOf("LEAP") != -1) {
AssignPoints.Limit = data[0].groups[i].name.substr(5,3);
}
}
/************** IT'S THIS LINE ONWARDS WHERE THE ALERTS SEEM TO BREAK IN IE */
if (AssignPoints.Limit == 0) {
AssignPoints.Specialist = true;
}
UWA.Data.getJson(AssignPoints.URL + "?cmd=getLimitsAndTotals&Giver_ID=" + AssignPoints.CurrentUser, AssignPoints.getPointsSpent);
}
AssignPoints.getPointsSpent = function(data) {
AssignPoints.SpentWeekly = data.SpentWeekly;
AssignPoints.SpentTotal = data.SpentTotal;
AssignPoints.displayLimitAndTotals();
}
// display data from getLimitAndTotals
AssignPoints.displayLimitAndTotals = function() {
var LimitsAndTotalsHTML = '<h2>Points Allocation</h2>';
if (AssignPoints.Specialist == false) {
LimitsAndTotalsHTML += '<ul><li>Weekly Limit: <strong>' + AssignPoints.Limit + '</strong></li>';
} else {
LimitsAndTotalsHTML += '<ul><li>Weekly Limit: <strong>Unlimited</strong></li>';
}
LimitsAndTotalsHTML += '<li>Spent this week: <strong style="color:#990000;">' + AssignPoints.SpentWeekly + '</strong></li>' +
'<li>Spent total: <strong>' + AssignPoints.SpentTotal + '</strong></li></ul>';
$('div#limits').html(LimitsAndTotalsHTML);
}
编辑:CSS 和HTML 我不认为这是 CSS/HTML 问题,因为我有这个脚本的先前版本(我决定重写它,因为它是可怕的代码和一些奇怪的程序混搭,只是纯粹的 bodging),它在 IE 中正确显示使用完全相同的 HTML 和 CSS。
#total_container
{ overflow: hidden; width: 870px; }
#groups
{ width: 250px; float: left; padding: 10px; }
#right_container
{ width: 580px; float: left; padding: 10px; }
span.check
{ font-size: 10px; color: #666; }
span.err
{ color: red; font-weight: 700; }
#limits, #search_div
{ width: 270px; float:left; padding: 0 10px; }
#groups li, #groups ul
{ list-style-type: none; background: none; margin: 0; padding: 0; }
#groups li a
{ background-color: #999; color: #eee; display: block; margin: 5px 0; border: #666; padding: 8px 2px 8px 10px; width: 243px; }
#groups li a:hover
{ background-color: #990000; }
HTML 只是 并且 JS 会更新它。
// 编辑
第二次编辑:警报
我尝试将随机警报放入代码中。在 IE 中,在 for (var i in data[0].groups)
循环中,警报起作用。如果我在 for 循环之后的任何点放置警报,则无论我使用变量名还是随机字符串(例如 "test"
),警报都不会出现。
在 FF 中,无论在任一功能中的位置如何,警报都会起作用。
** // 第二次编辑 **
FireFox,按预期工作
Internet Explorer,b0rked
有谁知道什么可能会破坏 IE?
提前致谢。
The following code displays as intended in FireFox, but isn't displaying at all in Internet Explorer (v8).
// getLimits init
Frog.API.get('users.getInfo',
{
'params': {'id': UWA.Environment.user.id, 'details':'groups' },
'onSuccess': AssignPoints.getLimit,
'onError': function(err) { alert(err); }
});
...
// work out the user's limit, and how many points they've spent this week
// use LEAP library if necessary
AssignPoints.getLimit = function(data) {
for (var i in data[0].groups) {
if (data[0].groups[i].name.indexOf("LEAP") != -1) {
AssignPoints.Limit = data[0].groups[i].name.substr(5,3);
}
}
/************** IT'S THIS LINE ONWARDS WHERE THE ALERTS SEEM TO BREAK IN IE */
if (AssignPoints.Limit == 0) {
AssignPoints.Specialist = true;
}
UWA.Data.getJson(AssignPoints.URL + "?cmd=getLimitsAndTotals&Giver_ID=" + AssignPoints.CurrentUser, AssignPoints.getPointsSpent);
}
AssignPoints.getPointsSpent = function(data) {
AssignPoints.SpentWeekly = data.SpentWeekly;
AssignPoints.SpentTotal = data.SpentTotal;
AssignPoints.displayLimitAndTotals();
}
// display data from getLimitAndTotals
AssignPoints.displayLimitAndTotals = function() {
var LimitsAndTotalsHTML = '<h2>Points Allocation</h2>';
if (AssignPoints.Specialist == false) {
LimitsAndTotalsHTML += '<ul><li>Weekly Limit: <strong>' + AssignPoints.Limit + '</strong></li>';
} else {
LimitsAndTotalsHTML += '<ul><li>Weekly Limit: <strong>Unlimited</strong></li>';
}
LimitsAndTotalsHTML += '<li>Spent this week: <strong style="color:#990000;">' + AssignPoints.SpentWeekly + '</strong></li>' +
'<li>Spent total: <strong>' + AssignPoints.SpentTotal + '</strong></li></ul>';
$('div#limits').html(LimitsAndTotalsHTML);
}
EDIT: CSS & HTML
I don't think it's a CSS/HTML issue, as I have the previous version of this script (which I decided to rewrite because it was hideous code and some odd mash-up of procedural and just pure bodging) which displays correctly in IE using exactly the same HTML&CSS.
#total_container
{ overflow: hidden; width: 870px; }
#groups
{ width: 250px; float: left; padding: 10px; }
#right_container
{ width: 580px; float: left; padding: 10px; }
span.check
{ font-size: 10px; color: #666; }
span.err
{ color: red; font-weight: 700; }
#limits, #search_div
{ width: 270px; float:left; padding: 0 10px; }
#groups li, #groups ul
{ list-style-type: none; background: none; margin: 0; padding: 0; }
#groups li a
{ background-color: #999; color: #eee; display: block; margin: 5px 0; border: #666; padding: 8px 2px 8px 10px; width: 243px; }
#groups li a:hover
{ background-color: #990000; }
The HTML is just <div id="limits"></div>
and the JS updates it.
// EDIT
SECOND EDIT: ALERTS
I've tried putting random alerts into the code. In IE, in the for (var i in data[0].groups)
loop, the alerts work. If I place an alert at any point after that for loop, the alert doesn't appear at all, regardless of whether I use a variable name or a random string such as "test"
.
In FF, the alerts work regardless of placement within either function.
** // SECOND EDIT **
FireFox, working as intended
Internet Explorer, b0rked
Does anyone know what might be breaking IE?
Thanks in advance.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
好的!我已经找到问题了。
IE 不喜欢这段代码:
当我将其更改为这种格式时:
它在 FF 和 IE 中按预期工作。
OK! I've found the problem.
IE didn't like this segment of code:
When I've changed that to this format:
It works as intended in FF and IE.