javascript - 任何适合 JQuery(或 Javascript)的数字选择器？

Question

是否有适合 jquery(或独立 js)的数字选择器？

我想要一个数字选择器，其中有用户可以选择的最大和最小数字。此外，它还有其他选项，例如显示奇数或偶数或质数或一个数字范围，从而跳过中间的一些数字。

Answer 1

使用 select为此，您可以创建一个数组，其中包含要跳过的数字并执行 for循环写入 options :

int minNumber = 0;
int maxNumber = 10;

int[] skipThese = { 5, 7 };

for (int i = minNumber; i <= maxNumber; i++)
{
    if(!skipThese.Contains(i)) Response.Write(String.Concat("<option value=\"", i, "\">", i, "</option>"));
}

您可以使用 razor 或任何其他方式来输出 HTML。

您也可以使用 jQuery 动态执行此操作，遵循相同的想法:

$(document).ready(function() {
    var minNumber = 0;
    var maxNumber = 10;

    var skipThese = [5, 7];

    for (var i = minNumber; i <= maxNumber; i++) {
        if ($.inArray(i, skipThese) == -1) $('#selectListID').append("<option value=\"" + i + "\">" + i + "</option>");
    }
});

编辑:或者您可以在 aspx 页面中使用上面的 C# 代码，并使用页面中的 AJAX 加载它:

在页面中创建一个选择框:

<select name="numPicker" id="numPicker">
    <option>Loading...</option>
</select>

在此页面的脚本中，您可以使用 jQuery 的 ajax()获取数据并填充 <select> :

$(document).ready(function() {
    var numPickerSelect = $("#numPicker");
    $.ajax({
        url: 'url/to/page.aspx',
        type: 'post'
        success: function(data) {
            numPickerSelect.find('option').remove(); // Remove the options in the select field
            numPickerSelect.append(data); // Load the content generated by the server into the select field
        },
        error: function() {
            alert('An error has ocurred!');
        }
    });
    //Or use this (not sure if will work)
    numPickerSelect.load("url/to/page.aspx");
});