Question

我有一个下拉菜单，其中包含开始时间和结束时间之间的时间。我的页面上还显示了一些“已预订”的时间。我正在尝试创建一个函数，以查看是否有任何“预订”值与下拉值匹配，如果有，则将其从数组中删除。我在弄清楚如何设计我的JavaScript函数时会遇到麻烦，对此将非常感谢。

remove.js

libname test "/folders/myfolders/Temp";

proc sql ; 
create view test.master as     
   select * from sashelp.cars (obs=4)     union   
   select * from sashelp.cars (firstobs=10 obs=14)     union
   select * from sashelp.cars (firstobs=30 obs=34); 
quit;  


data test;
    set test.master; 
run;

libname test ;

libname new "/folders/myfolders/Temp";

data test2; 
    set new.master;
run;

time.js

$(function () {
    var removeItem = document.getElementsByClassName('set');

    $('#time').find('option[value=="' + removeItem + '"]').remove();
});

Answer 1

首先，您应该使用jQuery！

$('#foo')与document.getElementById('foo')

$('.bar')与document.getElementByClassName('bar')

现在要解决您的问题，您正在尝试放置html元素

即document.getElementByClassName('set')

代替值。尝试运行console.log(removeItem)，您会明白我的意思。

我认为您要这样做的是

$(document).ready(function() {

  $('.set').each(function() { //loop over all elements with a class == 'set'

    const removeItem = $(this).val(); //get value of each element 

    $('#time').find('option=[value=="' + removeItem + '"]').remove();
  });

});

如果您需要其他帮助，请告诉我。

希望这会有所帮助！

更新

您应将removeItem循环放在addDropdown函数的末尾：

function addDropdown() {
    var doc = '',
        times = slotTimes,
        i;
    for (i = 0; i < times.length; i++) {
        doc += "<option value='" + times[i] + "'>" + times[i] + "</option>";
    }

    document.getElementById('time').innerHTML = doc;
    disabled();


  $('.set').each(function() { //loop over all elements with a class == 'set'

    const removeItem = $(this).val(); //get value of each element 

    $('#time').find('option=[value=="' + removeItem + '"]').remove();
  });
}

更新2

我建议您重写代码以使用selectpicker引导程序包。您似乎要尝试使大多数“功能”具有selectpicker使用的简单关键字。

例如，要禁用此下拉菜单中的选项：

<select class="selectpicker" id="toppings">
  <option id="opt_1">Mustard</option>
  <option id="opt_2">Ketchup</option>
  <option id="opt_3">Relish</option>
</select>

您只需：

$('#opt_2').prop('disabled', true);

如果您需要通过其 parent 下拉列表引用特定的特定选项，则可以使用children方法：

$('#toppings').children('.someClass').prop('disabled', true);

这将更改toppings下拉菜单中所有class="someClass"禁用的选项。

我敢肯定 selectpicker 包中有几个功能，这些功能以后也会有用！

我不确定您的代码到底有什么问题，但是它看起来越来越像 selectpicker 包，您可以免费使用它。

从动态生成的下拉列表中删除时间

1 个答案:

更新

更新2