Проблемы IE при использовании Jquery

Question

Я использую чекбокс, используя parentNode.nextElementSibling.value; он возвращает значение и прекрасно работает в Firefox. Но в IE он говорит, что объект равен нулю и говорю

Ошибка времени выполнения Microsoft JScript: 'ParentNode.nextElementSibling.value' является нулевым или нет объектом

Моя функция выглядит следующим образом

   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;

     }

Я использую этот способ, чтобы получить список данных, в котором были отмечены флажок и текстовое поле

     <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>

Answer 1

@ 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(), чтобы получить это поле ввода, и одновременно используем атрибут-равный селектор , чтобы получить только те поля, которые имеют value из 0 (провал проверки количества). Если найденные нами элементы .length превышают 0, то у нас возникают ошибки ... показать предупреждение и вернуть false.

Answer 2

IE не поддерживает nextElementSibling, потому что это нестандартное свойство, разработанное Firefox / Mozilla - стандарт, который IE (неудивительно) не поддерживает.

Вместо этого вам нужно будет использовать стандартный nextSibling, и, если у вас есть возможные текстовые узлы между вашими элементами, вам придется перебрать его, чтобы найти следующий элемент.

Большинство библиотек DOM, таких как jQuery, альтернативно предоставляют такую ​​функциональность.

Я пропустил, что вы на самом деле используете jQuery, поэтому используйте

var qty = $(ch).parent().next().val();

Кстати, смешивать jQuery и "чистый" DOM ​​сложно. Это может привести к таким ошибкам.

Answer 3

Ваша проблема на самом деле не в jQuery, а в специфичной для IE.

Internet Explorer не поддерживает nextElementSibling и, следовательно, его значение не будет определено в нем.

Решением вашей проблемы является использование jQuery для доступа к элементам вместо прямого доступа к DOM (как вы делаете сейчас).