netkathir/select

简单的选择框

维护者

详细信息

github.com/gunabalans/select

主页

源代码

问题

安装: 6

依赖项: 0

建议者: 0

安全性: 0

星星: 0

观察者: 2

分支: 0

开放性问题: 0

语言:HTML

类型:组件

v1.0.0 2022-04-17 09:41 UTC

MIT c606f41b7e045f5c66bec8ae1f37e8d95df4d663

javascripthtmlselect

This package is auto-updated.

Last update: 2024-09-13 07:50:01 UTC

README

这是一个带有选择和搜索功能的简单选择框，适用于HTML表单，可以作为select2的替代品。

示例

添加CSS

<link rel="stylesheet" href="../dist/css/select.css" />

实际的选择框HTML代码

<div class="selectBox">
          <input id="nklist" type="text" class="selectInput" tabindex="1" />
          <div class="selectedList" id="listid">
            <ul tabindex="2">
              <li value="Algeria">Algeria</li>
              <li value="American Samoa">American Samoa</li>
              <li value="Andorra">Andorra</li>
              <li value="Angola">Angola</li>
            </ul>
          </div>
    </div>

在页面底部加载脚本

<script src="../dist/js/select.js"></script>

调用脚本以启动选择框

<script>
      Nk.start({
        selectboxid: "#nklist",
        selectListid: "#listid",
        placeholder: "Select ..",
        maxHeight: "150px",
      });
</script>

截图

image