javascript - 将选择转换为输入而不是跨浏览器

Question

我有这个标记

<select id="helpamount" name="helpamount"><?= get_texto_clave('amount')?>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="-1" class="convertoinput">more</option>
</select>

此代码尝试将其转换为输入

$('body').on('click','.convertoinput',function(){
    $(this).parent().after('<input type="number" id="'+$(this).parent().attr('id')+'" name="'+$(this).parent().attr('id')+'" value="" placeholder="Especifica un valor numerico" /> ');
    $(this).parent().remove();
});

知道为什么这只适用于 firefox 吗？

Answer 1

跨浏览器->

$('body').on('change','#helpamount',function(){
    if($(this).val() == -1){
        $(this).after('<input type="number" id="'+$(this).prop('id')+'" name="'+$(this).prop('id')+'" value="" placeholder="Especifica un valor numerico" /> ');
        $(this).remove();
    }
    $('body').off('change', '#helpamount');
});​

jsFiddle example.