JS适用于FF，但不适用于IE

Question

我是JS新手。 我已经完成了2个简单的函数来更改输入按钮的值和onclick-event。

function doAjaxRequest(url, divID, buttonID) {
  $(divID).html('<img src="images/loader.gif" />');
  setTimeout(function(){ $(divID).load(url); }, 600);
  setTimeout(function(){ $(buttonID).attr({
      value: 'Schliessen',
      onClick: 'clear_div(\''+url+'\', '+divID.id+', '+buttonID.id+')'
    });}, 600);
};

function clear_div(url, divID, buttonID) {
    $(divID).empty();
    $(buttonID).attr({
      value: 'Mehr...',
      onClick: 'doAjaxRequest(\''+url+'\', '+divID.id+', '+buttonID.id+')'
    });
};

函数调用是

<div id="div1"></div>
<input type="button" id="button1" onClick="doAjaxRequest('test.html', div1, button1);" value="More..."/>

我用于首页的文档类型是

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

这些功能都可以在IE中正常工作，但在FF中，只有当我将doctype设置为时，它们才能工作

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">

我也尝试了“ loose.dtd”，但没有任何效果。

JS我在做什么错？ 希望可以有人帮帮我。

乔乔

Answer 1

问题可能在于onClick应该是onclick （在XHTML中，属性是重要的）。 但是有两个问题。

在您的标记中：
```
 <input type="button" id="button1" onClick="doAjaxRequest('test.html', div1, button1);" value="More..."/> 
```
您没有在div1或button1周围加上引号，这意味着您依赖浏览器将这些符号转储到全局名称空间中，因为它们是元素的ID。 这是相当普遍的（IE和其他一些工具也可以做到），但不是普遍的。 相反，我会传递字符串，然后正确地查找它们。

由于您使用的是jQuery，因此没有理由（也有一些理由不使用） onclick属性。

所以：

 function doAjaxRequest(url, divID, buttonID) { $('#' + divID).html('<img src="images/loader.gif" />'); setTimeout(function(){ $('#' + divID).load(url); }, 600); setTimeout(function(){ $('#' + buttonID) .attr({value: 'Schliessen'}) .click(function() { clear_div(url, divID, buttonID); }); }, 600); } function clear_div(url, divID, buttonID) { $('#' + divID).empty(); $('#' + buttonID) .attr({value: 'Mehr...'}) .unbind('click') .click(function() { doAjaxRequest(url, divID, buttonID); }); }

同样，您的按钮连接本来应该是：

 $("#button1").click(function() { doAjaxRequest('test.html', 'div1', 'button1'); });

...而不是在HTML中使用onclick 。 该代码需要显示在 HTML中的按钮之后（通常建议将script标签放在文档底部，紧接在</body>标签之前），或者可以将其包装在jQuery ready处理程序中：

 jQuery(function($) { $("#button1").click(function() { doAjaxRequest('test.html', 'div1', 'button1'); }); });

...因此它仅在DOM已加载时运行。

笔记：

现在，我们将真实函数用于事件处理程序，并以现代方式将其连接起来。
我们使用的是元素的ID，而不是元素的全局实例（并不完全可靠）。
在添加新的click处理程序之前，我们将使用unbind删除所有以前的click处理程序。
在函数声明之后不需要分号。 分号终止语句。 函数声明不是语句（它们是声明）。 就是说，在其中放置分号是无害的。 :-)

最后：我认为我可能只是让点击处理程序根据某个标志更改其行为，而不是删除旧的click处理程序并放入新的点击处理程序。

Answer 2

我不确定这是否是导致您出现问题的原因，但是您对doAjaxRequest的参数对我来说很有趣，其方式如下：我不确定所有浏览器都将某个元素公开为以该元素的ID命名的全局变量。 如果这样做，我会更确定您的代码是正确的：

onClick="doAjaxRequest('test.html', '#div1', '#button1');"

JS适用于FF，但不适用于IE

问题描述

2 个解决方案

解决方案1
6 已采纳 2011-11-03 08:17:02

解决方案2
0 2011-11-03 08:28:26

JS适用于FF，但不适用于IE

问题描述

2 个解决方案

解决方案1 6 已采纳 2011-11-03 08:17:02

解决方案2 0 2011-11-03 08:28:26

解决方案1
6 已采纳 2011-11-03 08:17:02

解决方案2
0 2011-11-03 08:28:26