Javascript 如何禁用'；下拉菜单B'；取决于在'；下拉列表A'；？

我是新来的，所以如果我的问题没有按原样提出，我深表歉意

基本上，我的目标是使用jQuery，这样当从第一个下拉框中选择名为“Apple”的字段时，第二个下拉框将只允许选择字段“Firm”，并禁用其他两个字段。但是，如果从第一个下拉框中选择了除“苹果”以外的任何其他水果，则可以选择第二个下拉框（纹理下拉框）中的所有选项

我在互联网上到处寻找jQuery代码来帮助我解决这个问题，但由于我是jQuery新手，我很难找到我需要的解决方案

以下是我的HTML代码：

<div class="ingredients_div">

   <select name="ingredients_form" id="ingredients_form_1">

      <option value="Apple" selected="">Apple</option>

      <option value="Orange">Orange</option>

      <option value="Lemon">Lemon</option>

      <option value="Mango">Mango</option>

   </select>

</div>


<div class="texture_div">

   <select name="texture_form" id="texture_form_1">

      <option value="Firm" selected="">Firm</option>

      <option value="Soft">Soft</option>

      <option value="Blended">Blended</option>

   </select>

</div>

苹果
橙色
柠檬
芒果
坚定的
软的
混合

---

非常感谢

请检查此代码，我认为它适合您

$（“#选择1”）.change（函数（）{
if（$（this）.data（'options'）==未定义）{
/*获取一个包含所有选项的数组-2并将其嵌入select1*/
$（this）.data（'options'，$（'#select2 option'）.clone（）；
}
var id=$（this.val（）；
var options=$（this.data（'options'）.filter（'[value='+id+']）；
$（'#select2'）.html（选项）；
});

苹果
橙色
柠檬
坚定的
软的
混合
要实现您提到的功能，您需要在第一个选择框上使用jQuery的事件绑定。值更改后，您需要根据第一个框中更改的值在第二个选择框中写入启用/禁用选项的逻辑

以下是您如何实现它的方法

$("#ingredients_form_1").change(function() {

  if ($(this).val() === "Apple") {
    $("#texture_form_1 option").prop("disabled", true);
    $("#texture_form_1 option[value='Firm']").prop("disabled", false);
  } else {
    $("#texture_form_1 option").prop("disabled", false);
  }

});

请阅读jQuery的文档以了解更多关于选择器、事件绑定的信息，最重要的是，在下一篇文章中，请介绍您在此之前所取得的成就。
您的代码在哪里？苹果橙柠檬芒果软糖混合编辑您的问题。代码不可读