Javascript работает в chrome, но не в IE

Если вы визуализируете код ниже в chrome, вы увидите, что это добавляет штраф, но если вы используете IE, строки не добавляются. Не могли бы вы сказать мне, что я делаю неправильно здесь, что он не работает в IE? Когда я добавляю новую строку в IE, моя новая строка не добавляет элементы управления. Это отлично работает в chrome и firefox, но не в IE. Я не мог найти ничего плохого в коде, если я не упустил что-то особенное для IE. Я ценю вашу помощь.Javascript работает в chrome, но не в IE

<head> 
<title></title> 
<script type="text/javascript"> 

    function insertAdditional() { 
     var type = document.getElementById('additional_type').value; 
     var node = document.createElement('li'); 
     node.innerHTML = document.getElementById(type + 'Form').innerHTML; 
     document.getElementById('additional').appendChild(node); 
    } 


    function addRow(tableID) { 

     var table = document.getElementById(tableID); 

     var rowCount = table.rows.length; 
     var row = table.insertRow(rowCount); 

     var cell1 = row.insertCell(0); 
     var element1 = document.createElement("input"); 
     element1.type = "checkbox"; 
     element1.name = "chkbox[]"; 
     cell1.appendChild(element1); 

     var cell2 = row.insertCell(1); 
     var element2 = document.createElement("input"); 
     element2.type = "date"; 
     element2.size = "12"; 
     element2.maxlength = "10"; 
     element2.placeholder = "YYYY-MM-DD"; 
     element2.name = "entrydate[]"; 
     cell2.appendChild(element2); 

     var cell3 = row.insertCell(2); 
     var element3 = document.createElement("input"); 
     element3.type = "date"; 
     element3.size = "12"; 
     element3.maxlength = "10"; 
     element3.placeholder = "YYYY-MM-DD"; 
     element3.name = "eventdate[]"; 
     cell3.appendChild(element3); 


     var cell4 = row.insertCell(3); 
     var element4 = document.createElement("textarea"); 
     element4.type = "text"; 
     element4.name = "comment[]"; 
     element4.rows = "4"; 
     element4.cols = "60"; 
     cell4.appendChild(element4); 

    } 

    function deleteRow(tableID) { 
     try { 
      var table = document.getElementById(tableID); 
      var rowCount = table.rows.length; 

      for (var i = 0; i < rowCount; i++) { 
       var row = table.rows[i]; 
       var chkbox = row.cells[0].childNodes[0]; 
       if (null != chkbox && true == chkbox.checked) { 
        table.deleteRow(i); 
        rowCount--; 
        i--; 
       } 


      } 
     } catch (e) { 
      alert(e); 
     } 
    } 

</script> 
</head> 
<body> 
<h1> 
    Comments</h1> 
<div> 
    <input type="button" value="Add Comment" onclick="addRow('dataTable')" /> 
    <input type="button" value="Delete Comment" onclick="deleteRow('dataTable')" />  </div> 
<table id="dataTable" width="1024px" border="1" cellpadding="10"> 
    <tr> 
     <th> 
      <center> 
       Choose</center> 
     </th> 
     <th> 
      <center> 
       Entry Date</center> 
     </th> 
     <th> 
      <center> 
       Event Date</center> 
     </th> 
     <th> 
      <center> 
       Comment</center> 
     </th> 
    </tr> 
    <tbody> 
     <tr> 
      <td> 
       <input type="checkbox" name="chk[]" /> 
      </td> 
      <td> 
       <input type="date" placeholder="YYYY-MM-DD" size="12" maxlength="10" name="entrydate[]" /> 
      </td> 
      <td> 
       <input type="date" placeholder="YYYY-MM-DD" size="12" maxlength="10" name="eventdate[]" /> 
      </td> 
      <td> 
       <textarea rows="4" cols="60" maxlength="500" name="comment[]"></textarea> 
      </td> 
     </tr> 
    </tbody> 
</table> 
</body>

источник

2013-05-05 bladerunner

* «... если вы используете IE, строки не добавляются ... Когда я добавляю новую строку в IE, моя новая строка не добавляет элементы управления ...» * Что это? Строка не добавляется, или она добавляется, но элементы управления не работают? – 2013-05-05 14:51:54

Извините, да элементы управления не добавляются в IE. – bladerunner

[jsfiddle] (http://jsfiddle.net/NKV8M/) для тех, кто хочет легко воспроизвести. –

Internet Explorer (даже 10) не поддерживает входной элемент типа дата. Более того: при попытке назначить такой тип (или любой другой не поддерживаемый тип) динамически созданный элемент ввода, JavaScript будет сбой с ошибкой и выполнение кода остановится в этой точке.

Чтобы преодолеть это и по умолчанию обратно текста типа, когда браузер не поддерживает требуемый тип, используйте .setAttribute() метод вместо прямого присваивания:

element2.setAttribute("type", "date");

Этот наконечник и многое другое можно найти here.

источник

2013-05-05 17:04:25

Потому что IE has no support for date inputs и никакой браузер кроме Opera и несколько последних. Хром имеет частичную поддержку, which started at Chrome 20.

Как указано в комментариях, IE является несколько проблематичным при изменении типов ввода. IE делает по умолчанию text, но, чтобы избежать проблем, IE's createElement accepts an HTML string где вы можете определить тип:

//creating a radio button 
var newRadioButton = document.createElement("<input type='radio' />");

источник

2013-05-05 14:53:32 Joseph

Может ли это предотвратить добавление входов, или они просто получат тип по умолчанию? – 2013-05-05 14:55:50

@squint они будут по умолчанию использовать текст. ОП ничего не сказал о том, что с ним произошло, хотя они превратились в текстовые входы. Если они этого не сделали, это совершенно новая история. – Joseph

В любой момент эта функция будет поддерживаться firefox в ближайшее время? Не то, чтобы я его использовал, но это достойный браузер. –

Попробуйте это:

try { 
    element2.type = "date"; 
} catch(e) { 
    element2.type = "text"; 
}

Это будет использовать date вход в браузерах, которые поддерживают его, и падения назад к text на других.

источник

2013-05-05 15:04:24 Barmar

Хорошая идея, но см. [Здесь] (http://diveintohtml5.info/detect.html) лучший способ: 'element2.setAttribute (« type »,« date »);' который по умолчанию будет использовать «текст» без каких-либо ошибок. –

@ShadowWizard Вы должны поместить это как ответ –

@ShadowWizard: ваше решение устранило проблему в IE. Не могли бы вы разместить это как ответ, чтобы я мог отметить это как решение. Огромное спасибо!! – bladerunner

Javascript работает в chrome, но не в IE

ответ

Смежные вопросы