Javascript 如何将输入框替换为空下拉列表？

首先，我有一个默认值是自定义输入，我从我的选择框中选择visa，然后输入框更改下拉值，这对我来说是可以的

但是，当我重新选择自定义框时，该框仍然显示DrowDown

我想在选择自定义时显示输入

HTML代码

$('#row_container').on('click', '.product_type', function(){ 
    var product_type = $(this).val();

    if( product_type == 'custom') {

        var option_input = $("<input type='text'/>") ;

        $(this).closest('tr').find('.product_id').empty();
        $(this).closest('tr').find('.product_id').append(option_input);
    }

})

$（'row#u container'）。在（'click'，'product_type'，function（）{
var product_type=$（this.val（）；
如果（产品类型==“自定义”）{
变量选项_输入=$（“”）；
$（this）.closest（'tr'）.find（'.product_id'）.empty（）；
$（this）.closest（'tr'）。find（'product_id'）。append（option_input）；
}
})

HTML代码

<tr>
    <td><?= form_dropdown('product_type', array(
                'custom' => 'Custom',
                'tour_package' => 'Tour',
                'visa' => 'Visa'
           ),'','class="product_type"'); ?>
    </td>

    <td class='product_name_id_td'><input type='text' class='product_name'/></td>
</tr>

我已经制作了一个提琴样品，请检查一下


签证
习俗
$（“span”）.html（“”）；
$（“#sel”）.更改（功能（e）{
if（$（this.val（）==“自定义”）
$（“span”）.html（“”）；
其他的
$（“span”）.html（“”）；
});
我已经创建了一个小提琴样本，请检查一下


签证
习俗
$（“span”）.html（“”）；
$（“#sel”）.change（函数（e）{
if（$（this.val（）==“自定义”）
$（“span”）.html（“”）；
其他的
$（“span”）.html（“”）；
});
现在我修复了这样的代码

$('#row_container').on('change', '.product_type', function(){ 

        if( $(this).val() == 'custom') {

           $(this).closest('tr').find('.product_name_id_td').html("<input type='text'/>");


        }
    })

$（'row_container'）。在（'change'，'product_type'，function（）{
if（$（this）.val（）=='custom'）{
$（this）.closest（'tr'）.find（'.product\u name\u id\u td'）.html（“”）；
}
})

谢谢你
现在我修复了这样的代码

$('#row_container').on('change', '.product_type', function(){ 

        if( $(this).val() == 'custom') {

           $(this).closest('tr').find('.product_name_id_td').html("<input type='text'/>");


        }
    })

$（'row_container'）。在（'change'，'product_type'，function（）{
if（$（this）.val（）=='custom'）{
$（this）.closest（'tr'）.find（'.product\u name\u id\u td'）.html（“”）；
}
})

谢谢你试试这个

$('#row_container').on('change', '.product_type', function(){ 
    var product_type = $(this).val();
    if( product_type == 'custom') {
      $(this).closest('tr').find('.product_name_id_td').empty().append("<input type='text'/>");
    }

})

$（'row_container'）。在（'change'，'product_type'，function（）{
var product_type=$（this.val（）；
如果（产品类型==“自定义”）{
$（this）.closest（'tr'）.find（'.product\u name\u id\u td'）.empty（）.append（“”）；
}
})
试试这个

$('#row_container').on('change', '.product_type', function(){ 
    var product_type = $(this).val();
    if( product_type == 'custom') {
      $(this).closest('tr').find('.product_name_id_td').empty().append("<input type='text'/>");
    }

})

$（'row_container'）。在（'change'，'product_type'，function（）{
var product_type=$（this.val（）；
如果（产品类型==“自定义”）{
$（this）.closest（'tr'）.find（'.product\u name\u id\u td'）.empty（）.append（“”）；
}
})

在上述场景中，您正在委派事件。因此，
$（this）.val（）
不起作用
如果出现下拉菜单（选择），请尝试更改事件，而不是单击事件

用这个


$('#row_container').on('change', '.product_type', function(e){

    var product_type = $(this).val();

    if( product_type === 'custom') {

        var option_input = "<input type='text'/>" ;

        $(this).closest('tr').find('.product_name_id_td').empty().append(option_input);
    }

});

$（'row#u container'）。关于（'change'，'product_type'，函数（e）{
var product_type=$（this.val（）；
如果（产品类型===‘自定义’）{
var选项_输入=”；
$（this）.closest（'tr'）.find（'.product\u name\u id\u td'）.empty（）.append（option\u input）；
}
});

在上述场景中，您正在委派事件。因此，
$（this）.val（）
不起作用
如果出现下拉菜单（选择），请尝试更改事件，而不是单击事件

用这个


$('#row_container').on('change', '.product_type', function(e){

    var product_type = $(this).val();

    if( product_type === 'custom') {

        var option_input = "<input type='text'/>" ;

        $(this).closest('tr').find('.product_name_id_td').empty().append(option_input);
    }

});

$（'row#u container'）。关于（'change'，'product_type'，函数（e）{
var product_type=$（this.val（）；
如果（产品类型===‘自定义’）{
var选项_输入=”；
$（this）.closest（'tr'）.find（'.product\u name\u id\u td'）.empty（）.append（option\u input）；
}
});
添加您的选项框和表格htmlOK bro，我现在添加这个我没有看到
”.product\u id
元素
$（this）.closest（'tr'）。find（'product\u name\u id\u td'）。empty（）
是的，兄弟，我弄错了类名。添加选项框和表htmlOK bro，我现在添加这个我看不到
。.product\u id
元素
$（this）。最近（'tr'）。查找（'.product\u name\u id\u td'）。空（）
是的，兄弟，我弄错了类名。
$（this）.val（）
在这里不起作用。它工作，兄弟，我的类产品类型在选择框中，选中它，这很好。您的小提琴在
$（this.val（）
上与类一起工作。它工作，兄弟，我的类产品类型在选择框中，选中它，这很好。你的小提琴在
上与类一起工作你的方法是work，shaunakde也在工作bro。你的方法是work，shaunakde也在工作bro。