How To Insert OPTIONs into SELECT with jQuery — Cross-Platform, Even IE6

后端 未结 2 1348
感动是毒
感动是毒 2021-02-20 04:39

I need a cross-platform way to insert OPTIONs into a SELECT with jQuery. I think I recall in the past that IE6 does nothing when this is called:


                        
    
提交评论

  • 2021-02-20 05:33

    JavaScript is Cross-Platform, Even IE6.

    To test how it looks in IE6 open Internet Explorer Browser (exist in Windows 10, it is not Edge Browser) and use F12 keyboard button (Developer tools), and in debug menu choose last button - Emulation - there you can see how it works in IE6, IE7, IE8, IE9, IE10 etc. The full screen example to test IE6 here: http://jsfiddle.net/3Qv6P/embedded/result/

    See how dynamically is changing the list of states if I choose the US or Canada

    example: 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>
    

    example: http://jsfiddle.net/3Qv6P/

    0 讨论(0)
  • 提交回复
    热议问题