在IE8中測試時，我的Javascript無法正常工作

-1

我正在製作一個網站，其中一個要求是與IE8兼容。我在我的頁面上有一個簡單的表單，並使用單選按鈕，我正在更改該表單的哪些字段集可見。基本上我給用戶一個選項，要麼輸入他的名字，要麼輸入他的號碼。我在F12菜單的IE8兼容模式下使用W10上的IE11，並且切換不起作用。它可以在其他地方使用，即使在IE9 +中也是如此你知道可能是什麼問題嗎？在IE8中測試時，我的Javascript無法正常工作

我的單選按鈕都有一個onclick函數，它可以在顯示器上設置一個字段集：none和另一個在display：block中。「header_form__fs_person」默認是隱藏的。

HTML：

  <form class="header__form" name="form_name"> 
       <fieldset class="header__form__label_choices"> 
        <label class="header__form__label" for="person">Podle jména</label> 
        <input class="header__form__input_radio" type="radio" value="person_on" id="person" name="choice" onclick="hideIc(this)" checked> 

        <span class="header__form__divider">/</span> 

        <label class="header__form__label" for="ic">Podle IČ</label> 
        <input class="header__form__input_radio" type="radio" value="ic_on" id="ic" name="choice" onclick="hidePerson(this)"> 
       </fieldset> 

       <fieldset class="header__form__fs_person"> 
        <input class="header__form__input_text" type="text" id="name" placeholder="Jméno" required> 

        <input class="header__form__input_text" type="text" id="lastname" placeholder="Příjmení" required> 

        <input class="header__form__input_text" type="text" id="bday" placeholder="Narozen" onfocus="(this.type='date')" required> 
       </fieldset> 

       <fieldset class="header__form__fs_ic" disabled> 
        <input class="header__form__input_text" pattern=".{9,}" placeholder="123456789" required> 
       </fieldset> 

       <label class="header__form__terms" for="terms">Souhlasím s <a class="header__form__terms_a" href="">obchodnimi podmínkami</a></label> 
       <input class="header__form__input_checkbox" type="checkbox" id="terms" required> 

       <input class="header__form__input_btn" type="submit" value="Ověřit"> 
      </form>

JS：

<script> 
      function hideIc(radio_btn) { 
       if (radio_btn.checked) { 
        var ic = document.getElementsByClassName("header__form__fs_ic"); 
        var person = document.getElementsByClassName("header__form__fs_person"); 

        for (var i=0; i < ic.length; i++) { 
         ic[i].style.display = "none"; 
         ic[i].disabled = true; 

         person[i].style.display = "block"; 
         person[i].disabled = false; 

        } 

       } 
      } 

      function hidePerson(radio_btn) { 
       if (radio_btn.checked) { 

        var ic = document.getElementsByClassName("header__form__fs_ic"); 
        var person = document.getElementsByClassName("header__form__fs_person"); 

        for (var i=0; i < ic.length; i++) { 
         ic[i].style.display = "block"; 
         ic[i].disabled = false; 

         person[i].style.display = "none"; 
         person[i].disabled = true; 
        } 
       } 
      } 

     </script>

來源

2016-10-08 Arcane

什麼specifally不工作和拋出什麼錯誤？請注意，如果沒有墊片，模式和佔位符將不受支持。 – charlietfl

沒有錯誤，它只是不起作用。當我點擊單選按鈕時什麼都沒有發生，沒有隱藏，什麼也沒有顯示。此外，模式和佔位符是我沒有看到的東西。我怎樣才能讓他們工作？ – Arcane

IE8不支持getElementsByClassName()。

在這裏看到：http://caniuse.com/#feat=getelementsbyclassname

有一個步行約：

if(!document.getElementsByClassName) { 
    document.getElementsByClassName = function(className) { 
     return this.querySelectorAll("." + className); 
    }; 
    Element.prototype.getElementsByClassName = document.getElementsByClassName; 
}

答案是不是我的......我在這裏找到：
javascript document.getElementsByClassName compatibility with IE

來源

2016-10-08 22:33:05

我閱讀了您的解決方案並嘗試了它，並且在所有瀏覽器上都能正常工作，但它仍然無法在IE8兼容模式下工作。我試過這個函數，我嘗試用'querySelectorAll'代替所有的'getElementsByClassName'，但它仍然不起作用。 – Arcane

如果你使用jQuery（你用它標記了你的問題），你可以使用'var person = $（「。header__form__fs_person」）;'...會更簡單。因爲，就像所說的，這個答案不是我的......我無法解釋爲什麼它不適合你。 –

在IE8中測試時，我的Javascript無法正常工作

回答

相關問題