Javascript JQuery使用下拉列表搜索元素

我想让它，若你们在下拉列表中选择除了条件以外的东西，它会搜索所有元素，并显示它们

我的jquery：

$('#searchbtn').click(function(){
  var e = document.getElementById("condition");
  var strUser = e.options[e.selectedIndex].value;

  $('.item').each(function(){
    var itemcondition = $('.condition').html();
    if (itemcondition === strUser.toLowerCase()){
      $(this).show();
    }
    if (itemcondition !== strUser.toLowerCase()){
      $(this).hide();
     }
  });

})

我的html：

<select id="condition">
    <option>Condition</option>
    <option value="factory new">Factory New</option>
    <option value="minimal wear">Minimal Wear</option>
    <option value="field tested">Field Tested</option>
    <option value="well worn">Well Worn</option>
    <option value="battle scarred">Battle Scarred</option>
 </select>

条件
新工厂
最小磨损
现场测试
破旧的
伤痕累累

这是元素的外观：

<div class="item" data-keywords="m4a4 howl">
  <div class="name">M4A4 Howl</div>
  <div class="condition">Factory New</div>
  <div class="price">800 000 coins</div>
  <button>Buy</button>
</div>

M4A4嚎叫
新工厂
80万硬币
购买

以下是您可以修复它的方法。 您的html属性和javascript代码应该更改。您应该根据产品的ID/slug条件给出选项值——它不应该有空间，因为我们将在下一步更轻松地管理这些数据

<select id="condition">
    <option>Condition</option>
    <option value="factory-new">Factory New</option>
    <option value="minimal-wear">Minimal Wear</option>
    <option value="field-tested">Field Tested</option>
    <option value="well-worn">Well Worn</option>
    <option value="battle-scarred">Battle Scarred</option>
 </select>

---

希望能有帮助。

以下是您可以修复它的方法。 您的html属性和javascript代码应该更改。您应该根据产品的ID/slug条件给出选项值——它不应该有空间，因为我们将在下一步更轻松地管理这些数据

<select id="condition">
    <option>Condition</option>
    <option value="factory-new">Factory New</option>
    <option value="minimal-wear">Minimal Wear</option>
    <option value="field-tested">Field Tested</option>
    <option value="well-worn">Well Worn</option>
    <option value="battle-scarred">Battle Scarred</option>
 </select>

---

希望有帮助。

问题是？这里什么不起作用，以及

.item

元素会是什么样子等？编辑了问题您的意思是要显示与您选择的下拉列表相对应的

.item

元素吗？是的，并隐藏其他元素，我确实找到了答案，但它似乎与我的另一个按关键字过滤元素的函数不起作用。这是我的全部代码：好吧，我明白了，很简单。我会把我的答案贴在下面。问题是？这里什么不起作用，以及

.item

元素会是什么样子等？编辑了问题您的意思是要显示与您选择的下拉列表相对应的

.item

元素吗？是的，并隐藏其他元素，我确实找到了答案，但它似乎与我的另一个按关键字过滤元素的函数不起作用。这是我的全部代码：好吧，我明白了，很简单。我会把我的答案贴在下面。

$('#searchbtn').click(function() {
    var $condition = $("#condition");
    var condition = $condition.val();
    $('.item').hide();
    $('.item.' + condition).show();
})