选择java脚本后如何使动态下拉列表保持在一个值

Question

现在我有一个从 json 文件中读取的动态列表以获取所有国家/地区名称，但我不确定如何在单击后使其保持在某个国家/地区名称。假设我选择一个国家名称加拿大，我希望它留在加拿大。现在，我将跳回到列表顶部的名称。有人可以告诉我如何让它留在某个国家名称？ 下面是我的html代码和javascript代码

    <select id="chooseName"  name="" onchange="changeVector()">   
    <option value=" empty"  selected = "selected"></option>
    </select>

    <script>
    $( "select" )
    .change(function () {
    var str = "";
         $( "select option:selected" ).each(function() {
        //str += $( this ).text() + "qwe ";
    });
        //$( "div" ).text( str );
    })
    .change();



    function changeVector(){
        Ajax3();
        addOption2();
        nameQuery();

    }

    //reading the data
    var Ajax3 = function ()  
    {      //var obj=document.getElementById('vector')
        //var name= "countries.shp"


    $.getJSON ("placelist/cb_2016_us_state_20m.shp.txt", function                        
    (data)  
    { 

       $.each (data, function (i, item)  
        {    for ( placeKey in item){

              placelist[i]=item[placeKey]


          }
          placelist.sort();


       });

    });  

    }  
    function  addOption2(){setTimeout(function(){ 
    //find the object according to the id，
        document.getElementById("chooseName").innerHTML = "";
        var  obj=document.getElementById( 'chooseName' );
        //find an option

        for(i=0;i<placelist.length;i++){
        obj.add( new  Option( placelist[i] , placelist[i] ));
        }

        },10); 
        }

Answer 1

如果是选择输入，添加“readonly”属性，如果是自定义元素，移除监听器或在css => pointer-event: none;