根据选择显示DropDown

时间:2014-04-24 05:11:22

标签: javascript jquery html asp.net-mvc

我为运营商创建了一个基本的Drop down list。 我在想是否有办法根据选择显示下拉项目。如果在Category下拉我选择价格是整数而不是运算符下拉列表应该只显示整数相关项目。

由于

1 个答案:

答案 0 :(得分:2)

这是你需要的吗? http://jsfiddle.net/lotusgodkk/GCu2D/22/

Javscript:

$(document).ready(function () { $(document).on('change', '.category', function () { var val = $(this).val().toLowerCase(); $('.operator option').hide(); $('.operator option.'+val).show(); $('.operator option.'+val+':first').attr('selected','selected').change(); }); });

HTML:

<select class="category">
    <option val="price">Price</option>
    <option val="weight">weight</option>
    <option val="size">Size</option>
    <option val="dimension">Dimension</option>
</select>
<select class="operator">
    <option val="1" class="price">For Price 1</option>
    <option val="2" class="price">For Price 2</option>
    <option val="3" class="price">For Price 3</option>
    <option val="4" class="price">For Price 4</option>    
    <option val="1" class="weight">For Weight 1</option>
    <option val="2" class="weight">For Weight 2</option>
    <option val="3" class="weight">For Weight 3</option>
    <option val="4" class="weight">For Weight 4</option>    
    <option val="1" class="size">For Size 1</option>
    <option val="2" class="size">For Size 2</option>
    <option val="3" class="size">For Size 3</option>
    <option val="4" class="size">For Size 4</option>
    <option val="1" class="dimension">For Dimension 1</option>
    <option val="2" class="dimension">For Dimension 2</option>
    <option val="3" class="dimension">For Dimension 3</option>
    <option val="4" class="dimension">For Dimension 4</option>
</select>

您可以修改它以更改类型检测。我使用类来选择选项,您可以在选项中设置自定义属性以区分它们。希望它有所帮助。