让 jQuery 在 IE 中识别 .change() [英] Getting jQuery to recognise .change() in IE

问题描述

当单选按钮组被更改/单击时，我使用 jQuery 来隐藏和显示元素.它在 Firefox 等浏览器中运行良好，但在 IE 6 和 7 中，该操作仅在用户单击页面上的其他位置时发生.

I'm using jQuery to hide and show elements when a radio button group is altered/clicked. It works fine in browsers like Firefox, but in IE 6 and 7, the action only occurs when the user then clicks somewhere else on the page.

详细说明，当您加载页面时，一切看起来都很好.在 Firefox 中，如果您单击一个单选按钮，一个表格行会被隐藏，而另一行会立即显示.但是，在 IE 6 和 7 中，您单击单选按钮，直到您单击页面上的某处才会发生任何事情.只有这样，IE 才会重新绘制页面，隐藏和显示相关元素.

To elaborate, when you load the page, everything looks fine. In Firefox, if you click a radio button, one table row is hidden and the other one is shown immediately. However, in IE 6 and 7, you click the radio button and nothing will happen until you click somewhere on the page. Only then does IE redraw the page, hiding and showing the relevant elements.

这是我正在使用的 jQuery:

Here's the jQuery I'm using:

$(document).ready(function () {
  $(".hiddenOnLoad").hide();

  $("#viewByOrg").change(function () {
    $(".visibleOnLoad").show();
    $(".hiddenOnLoad").hide();
  });

  $("#viewByProduct").change(function () {
    $(".visibleOnLoad").hide();
    $(".hiddenOnLoad").show();
  });
});

这是它影响的 XHTML 部分.整个页面验证为 XHTML 1.0 Strict.

Here's the part of the XHTML that it affects. The whole page validates as XHTML 1.0 Strict.

<tr>
  <td>View by:</td>
  <td>
    <p>
      <input type="radio" name="viewBy" id="viewByOrg" value="organisation"
      checked="checked" />Organisation</p>
    <p>
      <input type="radio" name="viewBy" id="viewByProduct" value="product" />Product</p>
  </td>
</tr>
<tr class="visibleOnLoad">
  <td>Organisation:</td>
  <td>
    <select name="organisation" id="organisation" multiple="multiple" size="10">
      <option value="1">Option 1</option>
      <option value="2">Option 2</option>
    </select>
  </td>
</tr>
<tr class="hiddenOnLoad">
  <td>Product:</td>
  <td>
    <select name="product" id="product" multiple="multiple" size="10">
      <option value="1">Option 1</option>
      <option value="2">Option 2</option>
    </select>
  </td>
</tr>

如果有人知道为什么会发生这种情况以及如何解决它，我们将不胜感激！

If anyone has any ideas why this is happening and how to fix it, they would be very much appreciated!

推荐答案

尝试使用 .click 而不是 .change.

这篇关于让 jQuery 在 IE 中识别 .change()的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！