Javascript показывает NaN в неправильном поле формы в IE - работает в Firefox и chrome

Question

Я пытаюсь настроить небольшой выбор статьи. Хотя он работает в Firefox и Chrome, а также в IE7, он имеет проблемы с IE8 и IE9.

• В IE 8 и 9 он изменяется на поле «увеличение» до «NaN» при нажатии. (Редактирование: решена путем размещения письмо перед номером)
• В IE9 он обновляет «Warenkorb», но места «NaN» или «\/» в
  поле для «Anzahl». (редактирование: разрешено путем размещения буквы перед номером)
• В IE8 он полностью игнорирует функцию обновления. (edit: относится к innerHTML-ошибке)

Мне кажется, что каким-то образом я не могу добраться до самой формы. Я уже пытался использовать document.forms[0] и document.getElementById["bestmult"] вместо этого, если доставленный объект не является полем внутри формы, но это ничего не изменило. Я чувствую, что решение очень простое, но я просто не могу наложить на него свой палец.

Вот код:

<script> 
     var sumarray = new Array(); 
     var artarray = new Array(); 
     var costarray = new Array(); 
     var counter=0; 

    function increase(obj, field, type){ 
     var form = obj.form; 
     var value = parseInt(form.elements[field].value, 10); 
     value++; 
     form.elements[field].value = value; 
     updateCosts(obj, field, type); 
    } 
    function decrease(obj, field, type){ 
     var form = obj.form; 
     var value = parseInt(form.elements[field].value, 10); 
     if(value > 0){ 
      value--; 
      form.elements[field].value = value; 
      updateCosts(obj, field, type); 
     } 
    } 

    function updateCosts(obj, field, type){ 
     var form = obj.form; 

     var exist = artarray.indexOf(form.elements[field].name); 

     var preis = 0; 
     if (type == 'b'){ 
      preis = 19.95; 
     }else if (type == 'p') { 
      preis = 29.95; 
     } 

     if (exist != -1){ 
      if (form.elements[field].value == 0){ 
       sumarray.splice(exist , 1); 
       artarray.splice(exist , 1); 
       costarray.splice(exist , 1); 
       counter--; 
      }else {  
       sumarray[exist] = form.elements[field].value; 
       artarray[exist] = form.elements[field].name; 
       costarray[exist] = preis; 
      } 
     }else { 
      sumarray[counter] = form.elements[field].value; 
      artarray[counter] = form.elements[field].name; 
      costarray[counter] = preis; 
      counter++; 
     } 

     var completestring = ""; 

     if (counter > 0) { 
      var product = 0; 
      completestring += "<h1>Warenkorb</h1><table border=0><tr style='background:gray;' align='center'><td width=110 align='center'>Artikel</td><td width=80>Anzahl</td><td align='center' width=60>Preis</td><td align='center' width='40'>Del</td></tr>"; 

      for(var i=0;i<counter;i++){ 
       completestring += "<tr><td>"+artarray[i].replace("_", " ")+"</td><td align=center>"+sumarray[i]+"</td><td align=center>"+costarray[i]+"</td><td align=center><img src='img/trash.png' onclick='setZero(\""+artarray[i]+"\")'></td></tr>"; 
       product += parseInt(sumarray[i])*parseInt(costarray[i]); 

      } 
      completestring += "</table><h2>"+(product).toFixed(2)+"</h2>"; 
     } else { 
      completestring += "<h1>Warenkorb</h1>"; 

     } 

     document.getElementById("sum").innerHTML = completestring; 
    } 

    function setZero(element) { 
     var form = document.forms[0]; 
     form.elements[element].value = "0"; 
     var obj = form.elements[element]; 
     updateCosts(obj, element, "b"); 

    } 
</script> 
<div id="sum"> 
</div> 
<form id="bestmult" action="test2.html" method="post"> 
<table cellpadding="0" cellspacing="0" border="0"> 
    <tr> 
     <td rowspan="2"><input type="text" name="1_Basis" value="0" onblur="updateCosts(this, '1_Basis', 'b')" /></td> 
     <td><input type="button" value=" /\ " onclick="increase(this, '1_Basis', 'b')" class="button" ></td> 
    </tr><tr> 
     <td><input type="button" value=" \/ " onclick="decrease(this, '1_Basis', 'b')" class="button" ></td> 
    </tr> 
</table> 

Этот код причины не все есть (хотя все, что потенциально может повлиять на проблему под рукой), так что не беспокойтесь со сценарием теги или неполную форму, которые только что добавлены для завершения, чтобы показать, как все это сочетается, не отправляя весь код.

Редактировать: похоже, что у IE8 и 9 есть проблема с тем, как я назвал текстовые поля. Я мог бы решить большую часть проблемы, просто поставив z в начале, после чего я могу просто удалить ее, чтобы вернуться к правильному тексту. Теперь просто IE8, похоже, не нравится innerHTML. Я много нашел в этом в Интернете, но ничего действительно не работает.

Answer 1

Итак, вот решение упакованы вместе в один ответ:

У меня возникли две проблемы:

Первым было то, что имя атрибута в XML не может начинаться с номера. Я решил это, просто добавив письмо впереди, которое я мог бы удалить для струнного лайнера с помощью функции replace.

Вторая проблема заключалась в том, что IE8 не имеет функции массива indexOf(). Спасибо вам, 555k за вашу помощь здесь, вы дали мне последнюю часть головоломки. Я написал небольшой обходной путь, который подходит моей ситуации:

var exist = -1; 
var needle = form.elements[field].name; 
for (var i=0;i<counter;i++){ 
    if (artarray[i].indexOf(needle) != -1){ 
     exist = i; 
    } 
} 

Это именно то, что я хочу, так это работает для моей проблемы. Это, по сути, не решение проблемы неэксентирующего «indexOf()» для старого браузера, но, возможно, кто-то может это использовать.

Answer 2

Проверьте свои изменения в коде сценария

<script> 
     var sumarray = new Array(); 
     var artarray = new String(); 
     var costarray = new Array(); 
     var counter=0; 

    function increase(obj, field, type){ 
     var form1 = obj.form; 
     //alert(obj.form1.elements[0].value); 
     var value = parseInt(form1.elements(field).value, 10); 
     value++; 
     form1.elements(field).value = value; 
     updateCosts(obj, field, type); 
    } 
    function decrease(obj, field, type){ 
     var form = obj.form; 
     var value = parseInt(form.elements(field).value, 10); 
     if(value > 0){ 
      value--; 
      form.elements(field).value = value; 
      updateCosts(obj, field, type); 
     } 
    } 

    function updateCosts(obj, field, type){ 
     var form = obj.form; 

     var exist = artarray.indexOf(form.elements(field).name); 

     var preis = 0; 
     if (type == 'b'){ 
      preis = 19.95; 
     }else if (type == 'p') { 
      preis = 29.95; 
     } 

     if (exist != -1){ 
      if (form.elements(field).value == 0){ 
       sumarray.splice(exist , 1); 
       artarray.splice(exist , 1); 
       costarray.splice(exist , 1); 
       counter--; 
      }else {  
       sumarray[exist] = form.elements(field).value; 
       artarray[exist] = form.elements(field).name; 
       costarray[exist] = preis; 
      } 
     }else { 
      sumarray[counter] = form.elements(field).value; 
      artarray[counter] = form.elements(field).name; 
      costarray[counter] = preis; 
      counter++; 
     } 

     var completestring = ""; 

     if (counter > 0) { 
      var product = 0; 
      completestring += "<h1>Warenkorb</h1><table border=0><tr style='background:gray;' align='center'><td width=110 align='center'>Artikel</td><td width=80>Anzahl</td><td align='center' width=60>Preis</td><td align='center' width='40'>Del</td></tr>"; 

      for(var i=0;i<counter;i++){ 
       completestring += "<tr><td>"+artarray[i].replace("_", " ")+"</td><td align=center>"+sumarray[i]+"</td><td align=center>"+costarray[i]+"</td><td align=center><img src='img/trash.png' onclick='setZero(\""+artarray[i]+"\")'></td></tr>"; 
       product += parseInt(sumarray[i])*parseInt(costarray[i]); 

      } 
      completestring += "</table><h2>"+(product).toFixed(2)+"</h2>"; 
     } else { 
      completestring += "<h1>Warenkorb</h1>"; 

     } 

     document.getElementById("sum").innerHTML = completestring; 
    } 

    function setZero(element) { 
     var form = document.forms[0]; 
     form.elements[element].value = "0"; 
     var obj = form.elements[element]; 
     updateCosts(obj, element, "b"); 

    } 
</script> 

Для ie8 indexOf() метода Array даст ошибку. Check this

Answer 3

Я думаю, что проблема связана с передачей «этого» функции. Кажется, что он пропускает кнопку.

Попробуйте заменить

var form = obj.form; 

с

var form=document.forms[0] 

и игнорировать ссылки на "OBJ"