选择搜索栏在小屏幕上消失

Question

我已经建立了通过搜索栏搜索id的形式，桌面视图

当我把视图转到手机屏幕时，搜索栏消失了。

小屏幕iphone屏幕

我代码:

<label for="supervisor"> </label>
<br>
<select  id="supervisor" class="chosen" onchange="getSuper(this.value)" required >
<option disabled selected value>-</option>
<option  value="ID3357">ID3357</option>
<option  value="ID2695">ID2695</option>

</select>

jquery

<script type="text/javascript">
$(".chosen").chosen();
</script>

我根据这个视频添加了搜索栏:https://www.youtube.com/watch?v=d-gAPYRLMeI

Answer 1

使用不同宽度的css媒体查询，例如

//小型设备(横向电话，576px及以上)@media (min-width: 576px){…}

//中等设备(平板电脑，768px及以上)@media (min-width: 768px){…}

//大型设备(桌面，992px及以上)@media (min-width: 992px){…}

//超大设备(大型桌面，1200px及以上)@media (min-width: 1200px){…}

根据你的设备宽度应用它们，并在它们之间应用不同的功能

Answer 2

我已经改变了JS函数，请点击此链接解决问题或在下拉菜单中添加(小屏幕)搜索栏

https://select2.org/getting-started/basic-usage