如何在Firefox以外的所有其他瀏覽器中實現此功能

Question

我有一個選擇列表，里面有數字。 這些數字從0到30。我想根據除當前日期和用戶設置的日期以外的天數來隱藏數字。

因此，如果今天是2010年7月28日，並且它們設置為2010年7月29日，則應該僅顯示“ 0”。

如果是2010年7月28日，而他們將時間設置為2010年9月20日，則應顯示0到30。

所以我有這個

  var selectedDate = new Date($('#TextBox').val().replace(/\/(\d\d)$/, "/20$1"));
    var currentDate = new Date();

    var month = currentDate.getMonth() + 1
    var day = currentDate.getDate()
    var year = currentDate.getFullYear()

    currentDate = new Date(month + "/" + day + "/" + year);


    if (isNaN(selectedDate) == false)
    {
        $('#selectList').find('select').attr('disabled', '');

        var diffDays = parseInt((selectedDate  - currentDate) / (1000 * 60 * 60 * 24));

        var Options = $('#selectList').find('option');

        jQuery.each(Options, function (i, value)
        {
            var currentValue = $(this).val();
            if (currentValue == -1)
            {
                // equal to continue;
                return true;
            }
            else if (currentValue >= diffDays)
            {
                $(this).hide();
            }
            else
            {
                $(this).show();
            }
        });
    }

此代碼在用戶選擇日期的文本框更改時發生。

這在FireFox中工作正常，但在任何其他瀏覽器中均無效。 我不知道為什么 在任何瀏覽器中均未顯示任何錯誤。

Answer 1

您根本無法像這樣的跨瀏覽器那樣隱藏/顯示<option>元素，您需要具有備份/隱藏的<select>並每次僅復制您想要的<option>元素，或者只是禁用<option>不想被選擇的元素，但是這將使它們可見。

克隆位看起來像這樣：

var hiddenSelect = $("#selectList").find('select').clone();
var selectedDate = new Date($('#TextBox').val().replace(/\/(\d\d)$/, "/20$1"));
var currentDate = new Date();

var month = currentDate.getMonth() + 1
var day = currentDate.getDate()
var year = currentDate.getFullYear()

currentDate = new Date(month + "/" + day + "/" + year);


if (isNaN(selectedDate) == false) {
    $('#selectList').find('select').attr('disabled', '');
    var diffDays = parseInt((selectedDate  - currentDate) / (1000 * 60 * 60 * 24));

    var select = $('#selectList').find('select').empty();
    hiddenSelect.children().each(function(i, value) {
        if (value == -1) {
            return true;
        }
        else if (currentValue < diffDays) {
            $(this).clone().appendTo(select);
        }      
    });
}

我們只是將原始副本的克隆副本保留在名為hiddenSelect的變量中，（通過.empty() ）清空UI中可見選項的選項，然后遍歷/克隆要查看的選項可見選擇。