Wybierz pole kurczy się w IE7, ale nie IE6 lub IE8

Mam problem w IE7 z pola jquery i wybierz. Kiedy ustawiam szerokość pola wyboru, a następnie użyję jquery do ponownego wypełnienia elementów przy zmianie pierwszego pola wyboru, drugie pole wyboru zostanie zmniejszone w oparciu o ustawioną szerokość.Wybierz pole kurczy się w IE7, ale nie IE6 lub IE8

Na przykład: Poniższy kod wykorzystuje dwa pola wyboru. Gdy w pierwszym polu wyboru zostanie wywołane zdarzenie zmiany, usunie ono wszystkie drugie pole wyboru i doda nowe wartości. Jeśli usuniemy atrybut stylu dla drugiego pola wyboru, pożądane zachowanie zostanie spełnione. Przy pozostawionym atrybucie stylu drugie pole wyboru będzie coraz mniejsze i ostatecznie zniknie.

Dzieje się tak tylko w IE7.

Kod jest następujący:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <title>test</title> 
    <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $("#selOne").change(function(){ 
       //Clear out the current service list 
       $("#selTwo option").each(function(){ 
        $(this).remove(); 
       }); 

       for(var i=0; i < 10; i++){ 
        var newOption = '<option value="'+ i +'">'+ i +'</option>'; 
        $("#selTwo").append(newOption); 
       } 
      }); 
     }); 
    </script> 

</head> 
<body> 
    <select id="selOne" class="number req" style="width: 90%;"> 
     <option value="" selected="selected">Initial Select</option> 
     <option value="">a</option> 
     <option value="">b</option> 
     <option value="">c</option> 

    </select> 
    <select id="selTwo" class="number req" style="width: 90%;"> 
     <option value="" selected="selected">These should update</option> 
     <option value="">100</option> 
     <option value="">101</option> 
     <option value="">102</option> 
    </select> 
</body> 
</html>

Jak mogę jeszcze określić szerokość, ale nie mają polu Wybierz skurczy się do niczego? Czy jedyną drogą jest bezwzględna szerokość w pikselach?

Źródło

2009-12-15 Scott

Wygląda jak błąd przeglądarki, nie wiem, jakie jest twoje pytanie, a nawet, czy istnieje. Wygląda na to, że masz całkowicie akceptowalną odpowiedź, tj. Użyj stylu szerokości, aby wymusić rozmiar listy rozwijanej. – Lazarus

Lazarus, błąd przeglądarki jest tym, czego się boję. Mieliśmy mnóstwo czasu, aby oderwać naszych użytkowników od IE6 z powodu błędów i problemów ze zgodnością. Chociaż nie jest to krytyczne z punktu widzenia użytkownika, jest to irytujące. W każdym razie, dodałem moje pytanie na końcu postu. – Scott

Poniższy kod dostaje drugą wybierz pole, aby pozostać prawidłowy rozmiar:

 $("#selOne").change(function(){ 
      //Clear out the current service list 
      $("#selTwo option").each(function(){ 
       $(this).remove(); 
      }); 

      /* IE7 Fix: reset the width based on pixels 
       It doesn't matter to how many, just that 
       the width is in pixels 
      */ 
      $("#selTwo").css("width","1px"); 

      for(var i=0; i < 10; i++){ 
       var newOption = '<option value="'+ i +'">'+ i +'</option>'; 
       $("#selTwo").append(newOption); 
      } 

      /*IE7 FIX: rest the width back to our desired percent */ 
      $("#selTwo").css("width","90%"); 
     });

Źródło

2009-12-15 17:31:28 Scott

można próbować ten jeden?

$("<option>").attr("value", i).text(i).appendTo("#selTwo");

Źródło

2009-12-15 17:32:12 jitter

Działa to w celu uzyskania opcji dołączonej do pola wyboru, ale problem z obcinaniem pola wyboru nadal pozostaje. Znalazłem pracę i opublikowałem poniżej. – Scott

W moim przypadku, po prostu stosować CSS siekać dla IE7 jak po -

select.number { *width: 280px !important; }

Uwaga: należy przejść na swojej równoważnej szerokości w pikselach.

Źródło

2013-11-11 10:10:31

Wybierz pole kurczy się w IE7, ale nie IE6 lub IE8

Odpowiedz

Powiązane problemy