IE9狀態/商店選擇選項不會追加

我在IE9及以下版本中遇到了麻煩的javascript錯誤。我有兩個選擇框。一個是「選擇你的狀態」框。此選擇過濾在該狀態下選擇選項的選項。IE9狀態/商店選擇選項不會追加

它在我嘗試過的所有事情中都能正常工作，但IE。正如您在HTML示例中看到的那樣，這些選項包含在optgroups中。我在document.ready上創建了一個選項對象，然後將它們從DOM中刪除。在更改狀態選擇框時，我將選項的一個子集與optgroups放在商店選擇中。但是，IE僅放置optgroups，但不包含選項。我已經嘗試了幾種將元素附加到select的不同方法，但IE不會附加optgroup的子選項。

這裏是簡化的html和適用的javascript。這是一個Drupal站點，所以我正在使用jQuery 1.4.4。

<select id="edit-state"> 
    <option value="AL">Alabama</option> 
    <option value="AZ">Arizona</option> 
    <option value="AR">Arkansas</option> 
    <option value="CA">California</option> 
</select>

假設選擇了亞利桑那州，這應該是第二個選擇框的HTML：

<select id="edit-store"> 
    <optgroup label="AZChandler"> 
     <option value="SPCHRAZ">Store Name</option> 
    </optgroup> 
    <optgroup label="AZPhoenix"> 
     <option value="SPPVAAZ">Store Name</option> 
     <option value="SPSCTAZ">Store Name</option> 
    </optgroup> 
    <optgroup label="AZScottsdale"> 
     <option value="SPRNTAZ">Store Name</option> 
    </optgroup> 
    <optgroup label="AZTempe"> 
     <option value="SPTEMAZ">Store Name</option> 
    </optgroup> 
    <optgroup label="AZTucson"> 
     <option value="SPORAAZ">Store Name</option> 
     <option value="SPSPEAZ">Store Name.</option> 
     <option value="SPRRDAZ">Store Name</option> 
    </optgroup> 
</select>

這裏的JavaScript。這個函數在編輯狀態改變時被調用。 options參數是所有optgroups和options的對象。這個函數過濾並附加它們。

function setStateOptions(options){ 
    var stateabbr = jQuery('#edit-state').find('option').filter(':selected').attr('value'); 
    jQuery('#edit-store optgroup').remove(); 

    jQuery(options).each(function() { 
     var label = jQuery(this).attr('label'); 
     var abbr = label.substr(0, 2); 
     if(abbr == stateabbr){ 
      var clone = jQuery(this).clone(); 
      jQuery(clone).appendTo('#edit-store'); 
     } 
    }); 
    //remove postal code abbr from beginning of optgroup labels. 
    jQuery('#edit-store optgroup').each(function(){ 
     var optlabel = jQuery(this).attr('label'); 
     jQuery(this).attr('label', optlabel.substr(2)); 
    }); 
}

謝謝！

來源

2013-01-02 tmbritton

'「不過，IE的地方只是S，而不是秒。」'請解釋 – Ibu

我期待 s和 s是純文本。更正了錯別字。謝謝！ – tmbritton

我編輯了一段代碼，測試從一個選擇中抓取optgroup並將它們放置在另一個選擇中。以下似乎在IE9中工作正常，與jQuery 1.4.4。我的理論是現在，這個問題是不是與功能，但參數你通過。

<select id="edit-store"> 
    <optgroup label="AZChandler"> 
     <option value="SPCHRAZ">SPCHRAZ</option> 
    </optgroup> 
    <optgroup label="AZPhoenix"> 
     <option value="SPPVAAZ">SPPVAAZ</option> 
     <option value="SPSCTAZ">SPSCTAZ</option> 
    </optgroup> 
    <optgroup label="AZScottsdale"> 
     <option value="SPRNTAZ">SPRNTAZ</option> 
    </optgroup> 
    <optgroup label="AZTempe"> 
     <option value="SPTEMAZ">SPTEMAZ</option> 
    </optgroup> 
    <optgroup label="AZTucson"> 
     <option value="SPORAAZ">SPORAAZ</option> 
     <option value="SPSPEAZ">SPSPEAZ</option> 
     <option value="SPRRDAZ">SPRRDAZ</option> 
    </optgroup> 
</select> 
<select id="Select2"> 
</select> 
<script type="text/javascript"> 
    jQuery('#edit-store optgroup').each(
     function() { 
      var label = jQuery(this).attr('label'); 
      var abbr = label.substr(2, 1); 
      if (abbr == 'T') { 
       var clone = jQuery(this).clone(); 
       jQuery(clone).appendTo('#Select2'); 
      } 
     } 
    ); 
</script>

來源

2013-01-03 18:35:26

IE9狀態/商店選擇選項不會追加

回答

相關問題