应用 Js 显示或隐藏元素答案

【问题标题】：Apply Js to show or hide elements应用 Js 显示或隐藏元素
【发布时间】：2021-02-10 13:41:48
【问题描述】：

我正在尝试显示选择选项，然后显示要过滤的输入

这是我的 js 代码

function showSearch(id) {
    if (id == "statusSearch") {
          $("#statusSearch").show();
          $("#monthSearch").hide();
          $("#employeeSearch").hide();
    }
}

但它不起作用，它不显示任何东西。只有我的第一个选择选项

       <select id="status" name="status" onChange="showSearch(this.value);">
            <option selected disabled>Select</option>
            <option name="statusSearch">Estado de OT</option>
            <option name="monthSearch">Mes</option>
            <option name="employeeSearch">Empleado</option>
        </select> 
        <button type="submit">Ver todo</button>

例如，如果我选择“statusSearch”

<div id="statusSearch" style="display: none;">
        <h2>Estado de OT</h2>
        <select type="text" name="searchByStatus">
                <option selected disabled>Elegir</option>
                <option name="open">Abierta</option>
                <option name="closed">Cerrada</option>           
        </select>
</div>

这是我的观点

$req3=$request;

if($req3) {
            $query = trim($req3->get('statusSearch')); 
            $search = MaintenanceTasks::select('Employee_Id_created','Task_Id','Machine_Id',
            'Request_date')//etc      
            ->get();        
        }

好吧，我不知道我做错了什么

【问题讨论】：

标签： javascript php jquery laravel

【解决方案1】：

在您的选项中使用 value="statusSearch" 而不是 name="statusSearch"

示例：

<option selected disabled>Select</option>
<option value="statusSearch">Estado de OT</option>
<option value="monthSearch">Mes</option>
<option value="employeeSearch">Empleado</option>

喜欢这里https://codepen.io/JUSEN/pen/dyOperB?editors=1010

【讨论】：

【解决方案2】：

您的选择器不正确：

function showSearch(id) {
   $( "#statusSearch option" ).each(function( index ) {


    if (id == "statusSearch") {
          $("#statusSearch option).each(function(  ) {
            if($this).attr('name') == "statusSearch"){
               $(this).show();
              
            }else if($this).attr('name') == "monthSearch"){
               $(this).hide();
              
            }else if {
              //and so on
             :
         });//end each

【讨论】：