让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严格。

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 。

Try using .click instead of .change.

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