Làm thế nào để chèn OPTION vào SELECT bằng jQuery - Cross-Platform, Ngay cả IE6

Tôi cần một cách đa nền tảng để chèn OPTION vào một SELECT bằng jQuery. Tôi nghĩ rằng tôi nhớ lại trong quá khứ rằng IE6 không làm gì khi điều này được gọi là:Làm thế nào để chèn OPTION vào SELECT bằng jQuery - Cross-Platform, Ngay cả IE6

<select id="myselect" size="1"> 
<option value=""></option> 
</select> 
<script type="text/javascript"> 
$('#myselect').append('<option value="test1">test1</option>'); 
$('#myselect').append('<option value="test2">test2</option>'); 
</script>

Tôi nghĩ rằng tôi đã làm việc ở tất cả các trình duyệt cũng như Firefox 2+ và IE7 +, nhưng không phải IE6. Chính xác? Nếu vậy, giải pháp thay thế là gì?

Nguồn

2010-07-22 Volomike

JavaScript là Nền tảng chéo, Ngay cả IE6.

Để kiểm tra xem nó trông như thế nào trong IE6 mở Internet Explore Browser và sử dụng tùy chọn F12 và trong menu gỡ rối mới chọn nút cuối cùng - Mô phỏng - bạn có thể xem nó hoạt động như thế nào trong IE6, IE7, IE8, IE9, IE10, vv màn hình đầy đủ ví dụ để kiểm tra IE6 đây: http://jsfiddle.net/3Qv6P/embedded/result/

Xem cách tự động đang thay đổi danh sách các tiểu bang nếu tôi chọn Mỹ hoặc Canada

dụ: http://jsfiddle.net/3Qv6P/

<!DOCTYPE html> 
<html><head></head><body> 
<div >Country * <select id="countrysel" name="country" onchange="CountryChange(this)"> 
    <option value="">-</option> 
    <option value="38">Canada</option> 
    <option value="44">China</option> 
    <option value="178">Russia</option> 
    <option value="225">USA</option> 
    </select></div> 
    <div>State/Prov.*<select id="state" name="state" style="display: none;"><option value="">-</option></select> 
    <input id="state_other" type="text" name="province" value=""></div> 

<!-- JAVASCRIPT --> 
<script language="javascript"><!-- 
//<![CDATA[ 
    function CountryChange(id){ 
     id = id.value; 
     id = parseInt(id); 

     st=document.getElementById("state"); 
     sto=document.getElementById("state_other"); 

     st.style.display="inline"; 
     sto.style.display="none"; 
     st.options.length=0; 

     if (id == 38){ 

      var CanadaProvinces = {52:"Ontario", 53:"Quebec", 54:"British Columbia", 55:"Alberta", 56:"Manitoba", 57:"Saskatchewan", 58:"Nova Scotia", 59:"New Brunswick", 60:"Newfoundland and Labrador",61:"Prince Edward Island", 62:"Northwest Territories", 63:"Yukon", 64:"Nunavut"}; 
      for(var key in CanadaProvinces) 
      { 
       var opt = document.createElement('option'); 
       opt.value = key; 
       opt.innerHTML = CanadaProvinces[key]; 
       st.appendChild(opt); 
      } 
     } else if (id == 225){ 

      var UnitedStates = {1:"Alabama", 2:"Alaska", 3:"Arizona", 4:"Arkansas", 5:"California", 6:"Colorado", 7:"Connecticut", 8:"D.C.", 9:"Delaware", 10:"Florida",11:"Georgia",12:"Hawaii",13:"Idaho",14:"Illinois",15:"Indiana",16:"Iowa",51:"Kansas",17:"Kentucky",18:"Louisiana",19:"Maine",20:"Maryland",21:"Massachusetts",22:"Michigan",23:"Minnesota",24:"Mississippi",25:"Missouri",26:"Montana",27:"Nebraska",28:"Nevada",29:"New Hampshire",30:"New Jersey",31:"New Mexico",32:"New York",33:"North Carolina",34:"North Dakota",35:"Ohio",36:"Oklahoma",37:"Oregon",38:"Pennsylvania",39:"Rhode Island",40:"South Carolina",41:"South Dakota",42:"Tennessee",43:"Texas",44:"Utah",45:"Vermont",46:"Virginia",47:"Washington",48:"West Virginia",49:"Wisconsin",50:"Wyoming"}; 
      for(var key in UnitedStates) 
      { 
       var opt = document.createElement('option'); 
       opt.value = key; 
       opt.innerHTML = UnitedStates[key]; 
       st.appendChild(opt); 
      } 
     }else{ 
      st.style.display="none"; 
      sto.style.display="inline"; 
     } 
    }  

//]]> 
--></script> 
<!-- /JAVASCRIPT --> 
</body></html>

dụ: http://jsfiddle.net/3Qv6P/

Nguồn

2014-07-24 13:38:00 Intacto

Trước hết, bạn không đợi DOM sẵn sàng với mã của mình. Bạn nên gói mã jQuery của bạn trong:

$(document).ready(function() { 

    $('#myselect').append('<option value="test1">test1</option>'); 
    $('#myselect').append('<option value="test2">test2</option>'); 

});

Tôi không chắc chắn về khả năng tương thích IE6, nhưng bạn có thể thử chức năng .appendTo thay vào đó, chẳng hạn như:

$('<option value="Test3">Test 3</option>').appendTo("#myselect");

dụ:

http://jsfiddle.net/W6L9d/

Nguồn

2010-07-22 17:22:56

Một lần nữa, không ai được thử nghiệm trong IE6. Tôi nhớ lại năm ngoái rằng IE6 đã có lỗi này. Thật không may tôi không có một trạm làm việc IE6 để kiểm tra với nữa. – Volomike

Ok. Tôi nghĩ rằng nếu bạn lo lắng về khả năng tương thích IE6 nói chung, bạn nên tìm cách để kiểm tra, cá nhân. Có nhiều cách để cài đặt IE6 và 7 cạnh nhau (ví dụ: http://tredosoft.com/Multiple_IE). –

Tôi có Ubuntu Linux làm máy trạm phát triển của mình. Tôi có một máy ảo thử nghiệm cho Windows 2008 Server Phiên bản dùng thử mà tôi sử dụng để thử nghiệm tất cả mọi thứ khác nhưng IE6. Giải pháp của Tredosoft sẽ không hoạt động. – Volomike

Làm thế nào để chèn OPTION vào SELECT bằng jQuery - Cross-Platform, Ngay cả IE6

Trả lời

Các vấn đề liên quan