如果“上一个”为空，则清除下一个嵌套的选择标记

Clear next nested select tags if previous is empty

本文关键字：上一个 嵌套 选择 下一个 为空 如果 清除      更新时间：2024-04-12

我遇到了以下问题-我得到了几个相互依赖的嵌套选择输入。我正试图产生以下效果-如果我选择"选择"选项，那么以下所有选择标签都将被清除

HTML:

<fieldset>
            <legend>Dwelling</legend>
            <p> 
                <span>Continet:</span> <select class="dwelling" name="continent" id="continent" onchange="getplaces(this.value,'country',this);"></select>
            </p>
            <p>
                <span>Country:</span> <select class="dwelling" name="country" id="country" onchange="getplaces(this.value,'province',this);"></select>
            </p>
            <p>
                <span>State / Provice:</span> <select class="dwelling" name="province" id="province" onchange="getplaces(this.value,'region',this);"></select>
            </p>
            <p>
                <span>County / Region:</span> <select class="dwelling" name="region" id="region" onchange="getplaces(this.value,'city',this);"></select>
            </p>
            <p>
                <span>City:</span> <select class="dwelling" name="city" id="city"></select>
            </p>
</fieldset>

JavaScript:

我试过了，但没有效果，我想我已经没有办法了。

function getplaces(val,src,t)
{   
    if(val!= "choose"){
        //fetching dependent records + one option on top with "choose" value    
    }else{
        $(t).closest('fieldset').nextAll(".dwelling").html("");
    }
}

编辑：感谢大家的快速回复，但也许我把问题表述错了。我想只清除带有"选择"选项的标签之后的下一个选择标签，这样所有位于它之前的标签都不会受到影响。

您需要针对下一个p元素中的所有select元素

function getplaces(val, src, t) {
    if (val != "choose") {
        //fetching dependent records + one option on top with "choose" value    
    } else {
        $(t).closest('p').nextAll().find('select.dwelling').empty();
    }
}

演示：Fiddle

我猜这正是您想要从下拉列表中删除的选项。

$(t).closest('fieldset').find(".dwelling option").remove();
相关文章：