如何从选择框中删除选项

-1

如果选择了room2和room4，我试图从选择框中删除最后2个选项。我无法让它工作。有任何想法吗？同样在第三个选择框，如果选项更多被选中我想7天自动被选中并显示警报：联系办公室长期停留。如何从选择框中删除选项

$('#calculator_accomodation').change(function(){ 
 
     if($(this).val() == 'ROOM2' || $(this).val() == 'ROOM4'){ 
 

 
    $("#cost_calculator_person").option("5").remove(); 
 
    $("#cost_calculator_person").option("6").remove(); 
 
    alert('room2 is triggered') 
 
     } 
 
    }); 
 
    $('#cost_calculator_days').change(function(){ 
 
     if($(this).val() == 'More') { 
 
    alert('Contact office for long stay'); 
 
    // code to select '7' goes here 
 
     } 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="calculator_accomodation" name="calculator_accomodation"> 
 
    <option value="ROOM1">ROOM ONE</option> 
 
    <option value="ROOM2">ROOM TWO</option> 
 
    <option value="ROOM3">ROOM TREE</option> 
 
    <option value="ROOM4">ROOM FOUR</option> 
 
    <option value="ROOM5">ROOM FIVE</option> 
 
    <option value="ROOM6">ROOM SIX</option> 
 
    <option value="ROOM7">ROOM SEVEN</option> 
 
    <option value="ROOM8">ROOM EIGHT</option> 
 
    </select> 
 
    <select id="cost_calculator_person" name="cost_calculator_person"> 
 
    <option value="1">1 PERSON</option> 
 
    <option value="2">2 PEOPLE</option> 
 
    <option value="3">3 PEOPLE</option> 
 
    <option value="4">4 PEOPLE</option> 
 
    <option value="5">5 PEOPLE</option> 
 
    <option value="6">6 PEOPLE</option> 
 
    </select> 
 
<select name="cost_calculator_days" id="cost_calculator_days"> 
 
    <option selected="" value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
    <option value="4">4</option> 
 
    <option value="5">5</option> 
 
    <option value="6">6</option> 
 
    <option value="7">7</option> 
 
    <option value="More">More</option> 
 
             </select>

来源

2016-11-26 hijacker83

使用这种@ Hijacker83 $（” #cost_calculator_person选项[value ='5']“）。rem OVE（）; – PRABA

@ hijacker83为您的日期选择答案已更新 –

尝试一下本作你的下一个编辑的问题

$('#cost_calculator_days').change(function(){ 

     if($(this).val() == 'More') { 
    $("#cost_calculator_days option[value='7']").prop('selected',true); 
    // code to select '7' goes here 
     } 
    });

来源

2016-11-26 11:50:24

有像jQuery中option()没有方法来代替使用attribute equals selector有特定属性值来获得元件。

$('#calculator_accomodation').change(function() { 
 
    if (this.value == 'ROOM2' || this.value == 'ROOM4') { 
 
    $("#cost_calculator_person option[value='4'],#cost_calculator_person option[value='6']").remove(); 
 
    alert('room2 is triggered') 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="calculator_accomodation" name="calculator_accomodation"> 
 
    <option value="ROOM1">ROOM ONE</option> 
 
    <option value="ROOM2">ROOM TWO</option> 
 
    <option value="ROOM3">ROOM TREE</option> 
 
    <option value="ROOM4">ROOM FOUR</option> 
 
    <option value="ROOM5">ROOM FIVE</option> 
 
    <option value="ROOM6">ROOM SIX</option> 
 
    <option value="ROOM7">ROOM SEVEN</option> 
 
    <option value="ROOM8">ROOM EIGHT</option> 
 
</select> 
 
<select id="cost_calculator_person" name="cost_calculator_person"> 
 
    <option value="1">1 PERSON</option> 
 
    <option value="2">2 PEOPLE</option> 
 
    <option value="3">3 PEOPLE</option> 
 
    <option value="4">4 PEOPLE</option> 
 
    <option value="5">5 PEOPLE</option> 
 
    <option value="6">6 PEOPLE</option> 
 
</select>

来源

2016-11-26 11:25:03

$（“＃cost_calculator_person选项[value ='5']，选项[value ='6']”）。remove（）;还有作品不用再写id了 –

非常感谢。有时解决方案可以非常简单:)在我编辑我的文章之前，您的回复太快了。在第三个选择框中，如果选择更多选项，我也希望自动选择值'7'。如果你能解释如何去做，我将不胜感激。 – hijacker83

你可以使用片。

$('#calculator_accomodation').change(function() { 
    if ($(this).val() === 'ROOM2' || $(this).val() === 'ROOM4') { 

     $('#cost_calculator_person').find('option').slice(4, 6).remove(); 
     alert('room2 is triggered'); 
    } 
});

来源

2016-11-26 11:39:13 PLT

也有效。谢谢。为什么===被使用，但不是==当选择“更多”选项时，有关如何自动选择选项'7'的任何想法？ – hijacker83

使用=== js也会匹配类型。 – PLT

例如。 1 =='1'= true 1 ==='1'= false '1'==='1'= true。 – PLT

尝试这样的财产以后...

$(document).ready(function() { 
 

 
     $('#calculator_accomodation').change(function(){ 
 
     var val = $(this).val(); 
 
     if (val == 'ROOM2' || val == 'ROOM4') { 
 
      $("#cost_calculator_person option[value='4']").css('display','none'); 
 
      $("#cost_calculator_person option[value='6']").css('display','none'); 
 
     } else { 
 
      $("#cost_calculator_person option[value='4']").css('display','block'); 
 
      $("#cost_calculator_person option[value='6']").css('display','bolck'); 
 
     } 
 
     }); 
 
     $('#cost_calculator_days').change(function(){ 
 
     if($(this).val() == 'More') { 
 
      alert('Contact office for long stay'); 
 
     } 
 
     }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="calculator_accomodation" name="calculator_accomodation"> 
 
    <option value="ROOM1">ROOM ONE</option> 
 
    <option value="ROOM2">ROOM TWO</option> 
 
    <option value="ROOM3">ROOM TREE</option> 
 
    <option value="ROOM4">ROOM FOUR</option> 
 
    <option value="ROOM5">ROOM FIVE</option> 
 
    <option value="ROOM6">ROOM SIX</option> 
 
    <option value="ROOM7">ROOM SEVEN</option> 
 
    <option value="ROOM8">ROOM EIGHT</option> 
 
    </select> 
 
    <select id="cost_calculator_person" name="cost_calculator_person"> 
 
    <option value="1">1 PERSON</option> 
 
    <option value="2">2 PEOPLE</option> 
 
    <option value="3">3 PEOPLE</option> 
 
    <option value="4">4 PEOPLE</option> 
 
    <option value="5">5 PEOPLE</option> 
 
    <option value="6">6 PEOPLE</option> 
 
    </select> 
 
<select name="cost_calculator_days" id="cost_calculator_days"> 
 
    <option selected="" value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
    <option value="4">4</option> 
 
    <option value="5">5</option> 
 
    <option value="6">6</option> 
 
    <option value="7">7</option> 
 
    <option value="More">More</option> 
 
             </select>

来源

2016-11-26 12:04:52

如何从选择框中删除选项

回答

相关问题