下拉列表更改功能在IE9

不工作我有兩個下拉列表，第二個下拉應當某事在第一個下拉列表改變，這是在Firefox中工作正常，但不是在IE改變。（IE9）。然後在第二個下拉列表中，我循環顯示這些項目，並隱藏其中的一些項目。下拉列表更改功能在IE9

var intermin = '${intermin}'; 
var intermin2=intermin.substring(1,3); 

$('#startSemester').change(function() { 

    var start=$('#startSemester').val(); 
    var end=$('#endSemester').val(); 
    var start1=start.substring(0,1); 
    var start2=start.substring(1,3); 
    var start3=""; 
    var end3=""; 
    if (start1=="H"){ 
     start3="2"; 
    } 
    else 
     start3="1"; 
    var start4=start2+start3; 

    $('#endSemester option').removeAttr("disabled"); 
    var endSemesters= $('#endSemester'); 

     $.each($('option', endSemesters), function(index, value) { 
      var end= ($(this).val()); 
      var end2=end.substring(1,3); 
      var end1=end.substring(0,1); 
      if (end1=="H"){ 
       end3="2"; 
      } 
      else 
       end3="1"; 
      var end4=end2+end3; 
      $('#endSemester ' + 'option' + '[value =' + end + ']').show(); 
      if (end4 < start4 || end2 > intermin2) { 
       $('#endSemester ' + 'option' + '[value =' + end + ']').hide(); 
      } 
     }); 
});

是否有某種方式可以在IE中工作。

來源

2013-05-06 brbe24

不確定，但var'end'可能是一個保留字。你可以改變它，然後再試一次嗎？ – 2013-05-06 12:17:25

@TimVermaelen負：保留字列表（https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Reserved_Words） – jbabey 2013-05-06 12:28:26

不，我改endsem，並沒有幫助。 – brbe24 2013-05-06 12:39:07

與IE的問題是隱藏選項部分。 IE在選項元素上不支持太多的CSS。尤其是display: none這就是.hide()所做的。

爲此我認爲這是最適合你禁用選項。

var changeOption = $('#endSemester ' + 'option' + '[value=' + end + ']'); 

changeOption.prop("disabled", false); 
if (parseInt(end4) < parseInt(start4) || parseInt(end2) > parseInt(intermin2)) { 
    changeOption.prop("disabled", true); 
}

可以在不同的瀏覽器測試：http://jsfiddle.net/tive/wU6XL/

或者如果你足夠執着找到一個插件：

隱藏select控制和使用替代ul li結構
包裝<option />與跨度（demo1 demo2）

PS：你可能要相應地更改選項值，因爲我對你的HTML沒有意見。

來源

2013-05-06 14:11:21

如何從選擇的DOM中刪除選項，並將它添加到某個數組中的某個地方需要稍後添加回來。 – crush 2013-05-06 14:57:20

我相信其中的一個演示就是這樣的。底線是你需要一個替代方案來隱藏選項元素X瀏覽器。 – 2013-05-06 15:03:33

它的作品，選項灰色，但它不如隱藏美麗。 – brbe24 2013-05-07 06:34:27

-2

嘿，請參閱該代碼

<asp:DropDownList ID="ddlWeeklyWeightIn" runat="server" ClientIDMode="Predictable"> 
      <asp:ListItem>1</asp:ListItem> 
      <asp:ListItem>2</asp:ListItem> 
      <asp:ListItem>3</asp:ListItem> 
      <asp:ListItem>4</asp:ListItem> 
     </asp:DropDownList>

JS代碼是

$('#ddlWeeklyWeightIn').on("change", function() { 
      alert($(this).val()); 
     });

請參閱鏈接See Demo

希望它可以幫助你。

來源

2013-05-06 12:43:30

這應該如何幫助？ – crush 2013-05-06 12:54:41

您不能像這樣定位ASP.NET控件，頁面上的ID呈現方式不同。 – tymeJV 2013-05-06 12:56:05

我同意但如果你給ClientIDMode =「可預測」，那麼沒有代碼的傷害。我只是試圖幫助你，這就是爲什麼我已經創建了演示給你，我只選擇了html控件。希望你不要錯過 – 2013-05-06 13:03:21

下拉列表更改功能在IE9

回答

相關問題