Javascript 当用户选择选项、导航或选择相同选项时，如何隐藏元素？

我正在练习JQuery，正在开发一个简单的应用程序，询问用户最喜欢的食物和饮料是什么

我正在尝试创建应用程序，以便生成的文本。。。“您最喜欢的食物是x，饮料是y”，仅在用户实际选择了他们最喜欢的食物/饮料并且没有主动选择时显示

我的问题是，我不知道如何在用户选择选项时隐藏生成的文本，而这种方式也能够在进行选择后显示文本。我使用了change（）方法，允许我在他们选择新内容时显示文本。但是如果用户不点击，或者选择了相同的选项呢

想法

$foodResultTxt.hide();

这是密码

想法

$foodResultTxt.hide();

当需要显示时：

$foodResultTxt.show();

---

可以考虑用<代码>焦点<代码>事件保存输入的当前值，然后将代码> >更改< /代码>之后的值与前一个和占位符进行比较。

$dropdownInputs.focus(function(){
    var oldFoodValue = $foodSelector.find(':selected').text();
    var oldDrinkValue = $drinkSelector.find(':selected').text();
}).change(() => {
    //IF food/drink has not been selected or is equal to the previous value, leave result hidden
    if ( $foodSelector.find(':selected').text() === 'Select an option...' ||
         $drinkSelector.find(':selected').text() === 'Select an option...' ||
         $foodSelector.find(':selected').text() === oldFoodValue ||
         $drinkSelector.find(':selected').text() === oldDrinkValue) {} 
    else {
      //Update and show result to display user's current answers
      $foodResultTxt.text($foodSelector.find(':selected').text());
      $drinkResultTxt.text($drinkSelector.find(':selected').text());
      console.log($resultTxt);
      $result.show(1400);
    }
  });

---

尝试使用经过编辑的

focus

和

blur

事件，以便注册两个输入的初始值，并在发生变化时将它们都考虑在内。这是一个很好的主意，我认为与我刚刚提出的另一个想法结合使用可能会奏效。我将在用户关注select时记录选择的值，然后在select元素的click处理程序中为整个文档设置click处理程序。如果用户单击文档中的任何位置（包括另一个答案），那么我将检查答案是否应该更新和显示。。。您是否看到此解决方案存在任何问题？谢谢你的帮助！不完全是我想要的，虽然-1不是我。我仍然很感激你的尝试