-1

示例：考虑到我有 2 个酒店房间可以出售 2 个选项 BB 或 HB，当我更改选择 1 的选项（在 BB 中选择 1 个房间）或更改选择 2 的选项（在 HB 中选择 1 个房间时，再次选择选项 1 或选项 2 仍然可用的房间数量必须只有 1

<script>
$(document).ready(function() {
  $('#rates1').change(function() {
    var val = parseInt($(this).val());
    var optionlength = ($('#rates1 option').length);
    var optionremove = optionlength - val - 1;
    //alert(optionremove);
    $('#rates2 option').remove();
  });
});
</script>


<select id="rates1" class="selectclass">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>

</select><br />
<select id="rates2" class="selectclass">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>
4

2 回答 2

0

根据我的理解，您想显示select2基于select1.

如果那是你的意思，那么试试这个

<select id="rates1" class="selectclass">
    <option value="0">0</option>
    <option value="50">1</option>
    <option value="100">2</option>
</select>
<select id="rates2" class="selectclass">
    <option data-rates1="1" value="0">0</option>
    <option data-rates1="1"  value="80">1</option>
    <option data-rates1="2" value="160">2</option>
</select>

JS：

$('#rates1').on('change', function () {
    if ((this.value === '0') || (this.value === '50')) {
        $('#rates2 option[data-rates1=1]').show();
        $('#rates2 option[data-rates1=2]').hide();
    }
    else {
        $('#rates2 option[data-rates1=1]').hide();
        $('#rates2 option[data-rates1=2]').show();

    }
});

看看这个小提琴

您可能会感到困惑，data-rates它只不过是.HTML5

希望你明白我的意思。

于 2013-08-28T15:04:18.727 回答
0

The question is unclear, so I'm going to interpret it as: when an option in the first <select>tag is chosen, change the options available to select in the second <select>tag.

注意：您不能对多个项目使用相同的 id 属性；id 的目的是唯一地定义一个项目。在这种情况下，我将第一个<select>标签称为id="selectid1"，第二个<select>标签称为id="selectid2".

当在第一个选择标记中选择选项“1”时，尝试使用此代码从第二个选择标记中删除选项“1”：（jsfiddle 演示）

$("#selectid1").change(function () {
    var selected_value = $("#selectid1 option:selected").val();

    // adds the default options each time the .change() handler is fired
    $("#selectid2").html("<option value=\"0\">0</option><option value=\"80\">1</option><option value=\"160\">2</option>");

    if (selected_value == 50) {
        $("#selectid2 option[value='80']").remove();
    }
});

主要内容是 .change() 处理程序，用于检测选择何时更改，以及按值选择选项的语法，这是我从这个问题中找到的。

于 2013-08-28T15:21:28.707 回答