如果<option>选择，则在<option>另一个下拉列表中停用一个或多个

Question

老实说，我不是Javascript专家。我想要实现的是根据第一个下拉中的选择，在第二个下拉中停用一个或多个<option>

我在这里检查了很多其他答案，但我无法将它们适应我的代码。

<select name="ptp_filter_doc_category" data-column="doc_category" data-tax="doc_category" data-search-column="doc_category_hfilter" aria-label="Category">
<option value="">Category</option>
<option value="category-one">Category 1</option>
<option value="category-two">Category 2</option>
</select>
<select name="ptp_filter_tag_one" data-column="tag_one" data-tax="tag_one" data-search-column="tag_one_hfilter" aria-label="Tag 1">
<option value="">Tag</option>
<option value="tag-1">Tag 1</option>
<option value="tag-2">Tag 2</option>
<option value="tag-3">Tag 3</option>
<option value="tag-4">Tag 4</option>
<option value="tag-5">Tag 5</option>
<option value="tag-6">Tag 6</option>
</select>

我想要实现的是：

如果选择类别1->标签3、标签4、标签5、标签6停用

我试过这个：

if ($('option[value=category-1]').prop('selected', true)) {
$('option[value=tag-3]').prop('disabled', true);
}

Answer 1

您的javascript代码将无法工作，因为过滤会检查错误的值。应该是：

if ($('option[value=category-one]').prop('selected', true)) {
$('option[value=tag-3]').prop('disabled', true);
}

您可能希望在标记选项中使用数据标记来指定应为哪些类别启用/禁用数据标记，因此类别和标记之间的链接并不固定。