javascript - <Select> 下拉菜单顺序不正确

标签 javascript jquery html css

<分区>

我有一个选择下拉列表,其中动态填充了来 self 们服务器的文件名,在服务器目录上,所有内容都是正确排序的。

但是在下拉列表中,它会将较高的整数编号在较低的上方,例如澳大利亚 #11 在澳大利亚 #100 之后,如图所示。

虽然我了解如何在 html 中更改顺序,但我不确定在动态填充时是否可行?

还显示了显示它在目录中正确排序但在下拉列表中排序不正确的图像。

下拉列表:

目录:

最佳答案

列表按字母顺序排序,因此“#11”位于“#109”之后。

要解决此问题,您可以编写自己的排序函数来仅考虑数字部分而不是整个字符串。这样它就会按数字而不是字母顺序排序。这是一个快速的 ES6 解决方案。

let countryList  =    [/*list here*/];

countryList      =    countryList.sort( (eachLine, prevLine) => eachLine.split("#")[1].split(" ")[0] - prevLine.split("#")[1].split(" ")[0] );

这只是根据字符串的数字部分对其进行排序,而忽略其余部分。

关于javascript - <Select> 下拉菜单顺序不正确,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48902576/

上一篇:html - CSS 动画在 IE 和 Microsoft Edge 中不起作用

下一篇:javascript - 在 html 中显示浏览器特定 "popups blocked"图标的内置方式?

相关文章:

javascript - 带有自定义复选框的 Jquery.validate()

java - 如何从网页中获取特定文本

PHP 和 Ajax 文件上传 - 无法使用 $_FILES 获取 tmp_name

javascript - 检查是否加载了javascript文件

javascript - 禁用加载动画砌体无限滚动

php - 如何从pdf中提取文本层和背景层?

php - 输出html div冲突

javascript - 使可排序的元素可拖动,可以将其放在可放置的对象上,并在向后拖动时可以再次连接到列表

jquery - 未设置属性时的 CSS 属性选择器(或者我如何只选择非禁用输入[类型 ="text"])

jquery - 每次 Ajax 调用后重新绘制 Google 图表