select通过click发送Ajax,动态刷新,但是我选择完option后,click又触发了一次,导致我选择的option被置为第一项

img


如图,获取动态数据选择完后,我一松开手就又刷新了一次
前端代码如下


<script>
      function  selectChool(){
                        $.ajax({
                                      url:"/school/SchoolSelect",
                                      type: "post",
                                      success: function(data){
                                           $("select").empty();
                                         data.forEach(function (item,index){
                                              $("select").append("<option>"+item+"</option>");
                                          });
                                      }
                        }); 
                     document.getElementById("select").click=null;
          }
      
      
    </script>
    </head>
    <body>
        <a th:text="${TSHI}"></a>
        <form action="/school/specialtyadd" method="post" >
            <label for="select">学校名称:</label>
            <select id="select" name="schoolname" onclick="selectChool()" >
                <option>请选择学校</option>
            </select>
            <label>添加专业:</label><br>
        
            <label for="specialty">专业名称:</label>
            <input type="text" name="specialtyName" id="specialty"/><br>
            <label for="admitscore">录取分数:</label>
            <input type="text" name="admitscore" id="admitscore" /><br>
            <label for="admitAmount">录取名额:</label>
            <input type="text" name="admitAmount" id="admitAmount" /><br>
            <label for="specialtyclass">专业类型:</label>
            <input type="radio" id="specialtyclass" name="specialtyclass" value="理科"> 理科<input type="radio" name="specialtyclass" value="文科">文科<br>
            <input type="submit" value="提交" id="submit" />
        </form>
    </body>

而且不知道为什么,这个click的事件取消绑定不知道为什么没有用

我想问的是怎么样让他选择完后不会刷新,我重新点击再动态获取,我试过了取消绑定click,这样的话就只能动态获取一次,感谢各位!

1.给你得option标签加上一个阻止事件冒泡,这样能避免,点击option的时候触发select的click事件
2.获取数据之前先存一下上一次选择的,然后获取数据后,循环的时候,如果item是上一次选中的,就给option一个选中的状态,这样你重新获取后就不会清空上一次的选中状态。

浏览器按F12查看请求,有的浏览器有预检

不要用click事件,select有一个change事件就是当你选择的值发生改变的时候,用这个事件