Select2加载远程数据

最新推荐文章于 2022-09-02 17:08:02 发布

原创

最新推荐文章于 2022-09-02 17:08:02 发布 · 3.8k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#搜索 #select

本文介绍了如何使用Select2插件在HTML中实现异步加载远程数据的功能，以满足大数据量下拉框的需求。通过示例代码展示了如何配置Select2的ajax选项，连接到后台接口，进行POST请求，以及处理返回的数据并实现分页。当输入达到一定字符长度时，触发加载更多数据。

现在项目中的数据越来越多，对于需求来说，普通的下拉框是不能满足现在的需求，于是想到了之前看到的select2这个插件可以异步加载，就像百度的搜索一样

下面就说一下具体该如何使用

<!DOCTYPE html>
<html>
<head>
    <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
    <script src="//cdn.bootcss.com/select2/4.0.3/js/select2.min.js"></script>
    <link href="//cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
    <link href="//cdn.bootcss.com/select2/4.0.3/css/select2.min.css" rel="stylesheet">

</head>
<body>

<select id="select2" </