1

我有一些下拉框充当页面上的过滤器。当任何一个被选择时，页面会重新加载并根据选择过滤帖子。

我想要做的是在页面重新加载时隐藏特定选择，如果该值不是空白字符串（例如，如果有人选择“奥克兰”，我希望选择输入在重新加载时从页面中消失，但是另一个选择应该保持可见）。

这是HTML...

<ul>
<li>
    <label style="display:none;">Location:</label>
    <select onchange="this.form.submit();" name="locations" class="filter-dropdown">
        <option value="">SELECT</option>
        <option value="auckland" class="level-0">Auckland</option>
        <option value="tauranga" class="level-0">Tauranga</option>
        <option value="wellington" class="level-0">Wellington</option>
    </select>
</li>
<li>
    <label style="display:none;">Product or service:</label>
    <select onchange="this.form.submit();" name="typeofproduct" class="filter-dropdown">
        <option value="">SELECT</option>
        <option value="clothing" class="level-0">Clothing</option>
        <option value="food" class="level-0">Food</option>
        <option value="shoes" class="level-0">Shoes</option>
        <option value="travel" class="level-0">Travel</option>
    </select>
</li>

这是我使用jQuery的糟糕尝试......

    jQuery('.filter-dropdown').bind('change', function(event) {

        var x = jQuery(".filter-dropdown option:selected").text();

        if (x == "") {
            jQuery(this).show();
        }
        else{
            jQuery(this).hide();
        }
    });

我已经尝试了各种方法，但我得到的最接近的是隐藏所有下拉列表的页面（应该只适用于已选择的下拉列表。我使用类而不是 ID 的原因是因为可能有更多下拉列表其他页面。

4

1 回答 1

0

隐藏用户的选择不是一个好功能，因此他们不仅看不到他们选择的内容，而且也无法更改它。无论如何，以下将完成这项工作：

var element = docment.formName.locations;
if (element.value != '') {
  element.style.display = 'none';
}

用表单的实际名称或 ID 替换formName。

请注意，当页面加载时，默认情况下选择是可见的，因此只需根据其值隐藏它。另请注意，在大多数浏览器中，默认情况下该值将是第一个选项的值，除非某些其他选项设置为默认选定选项。

最后，如果选项没有 value 属性，IE 8 及更低版本将不会与上述行为一致，因此请确保它们有一个（给它们与文本相同的值是好的）。

于 2012-06-26T00:56:48.840 回答