使用Jquery时IE的问题

时间:2010-10-12 09:31:40

标签: asp.net jquery html internet-explorer

我正在使用复选框的兄弟姐妹 parentNode.nextElementSibling.value;它将返回值并在Firefox中正常工作。但在IE中它表示Object为null 并说

  

Microsoft JScript运行时错误:   'parentNode.nextElementSibling.value'   是null或不是对象

我的功能如下

   function chkEnergy() {
             var inputs = $('.check input');
            var count = 0;var ok = 1;
        for (var i = 0; i < inputs.length; i++) {
            //alert(inputs[i].attr('checked'));
            if (inputs[i].checked == true) {
                var ch = inputs[i];
                var qty=ch.parentNode.nextElementSibling.value;
                if (qty == "0") {
                    ok = 0;
                    showStatus(true, "Please specify the Quantity");
                    return false;
                }
                else {
                    ok = 1;
                    continue;
                }
            }
        }
            if(ok==1)
                return true
            else
              return false;

     }

我使用这种方式将dataList放在复选框和文本框中

     <asp:DataList ID="dlstEnergyItems" runat="server" RepeatColumns="4" RepeatDirection="Horizontal"  Width="100%">
  <ItemTemplate>
   <asp:CheckBox ID="cbEnergyItems" runat="server" CssClass="check" />
    <input type="text" id="txtQty"  style="width:25px" class="hide textbox numbers_only" value="0"  runat="server" /> 
       <asp:HiddenField ID="HdfEnergy" runat="server" />
            <asp:HiddenField ID="HdfEnergyCID" runat="server" />
        </ItemTemplate>
</asp:DataList>

Renederd HTML

<table cellspacing="0" border="0" style="width: 100%;
 border-collapse: collapse;" 
id="ctl00_ContentPlaceHolder1_dlstEnergyItems">
<tbody><tr>
<td>
 <span class="check"><input type="checkbox" name="ctl00$ContentPlaceHolder1$dlstEnergyItems$ctl00$cbEnergyItems" id="ctl00_ContentPlaceHolder1_dlstEnergyItems_ctl00_cbEnergyItems"><label for="ctl00_ContentPlaceHolder1_dlstEnergyItems_ctl00_cbEnergyItems">
Energy-1</label></span>
  <input type="text" value="0" class="textbox numbers_only" style="width: 25px;" id="ctl00_ContentPlaceHolder1_dlstEnergyItems_ctl00_txtQty" name="ctl00$ContentPlaceHolder1$dlstEnergyItems$ctl00$txtQty"> 
  <input type="hidden" value="1" id="ctl00_ContentPlaceHolder1_dlstEnergyItems_ctl00_HdfEnergy" name="ctl00$ContentPlaceHolder1$dlstEnergyItems$ctl00$HdfEnergy">
 <input type="hidden" 
id="ctl00_ContentPlaceHolder1_dlstEnergyItems_ctl00_HdfEnergyCID" name="ctl00$ContentPlaceHolder1$dlstEnergyItems$ctl00$HdfEnergyCID">
 </td></tr></tbody></table>

3 个答案:

答案 0 :(得分:5)

@ jsalonen有正确的原因(缺乏IE支持),但这里有一个解决方案......如果你包含jQuery,请使用它:)这是你的函数的简短版本跨浏览器工作:

function chkEnergy() {
  var fails = $('.check:has(input:checked)').next("[value=0]").length;
  if (fails > 0) showStatus(true, "Please specify the Quantity");
  return fails === 0;
}

在此我们使用.next()来获取输入字段并同时使用attribute-equals selector来获取value 0 0的字段(未通过数量检查)。如果我们找到的.length元素超过false,那么我们会遇到一些失败...显示提醒并返回{{1}}。

答案 1 :(得分:2)

你的问题实际上不是jQuery,而是IE特定的。

Internet Explorer does not support nextElementSibling,因此不会在其中定义它的值。

你的问题的解决方案是使用jQuery来访问元素而不是直接访问DOM(正如你现在所做的那样)。

答案 2 :(得分:2)

IE不支持nextElementSibling,因为它是由Firefox / Mozilla 发明的非标准属性IE(不出所料)不支持的标准。

您需要使用标准nextSibling,如果您的元素之间有可能的文本节点,则需要循环它以查找下一个元素。

大多数DOM库(如jQuery)都提供了这样的功能。

我错过了你实际上在使用jQuery,所以请使用

var qty = $(ch).parent().next().val();
BTW,将jQuery和“纯粹”DOM混合在一起令人困惑。这可能导致这样的错误。