Tengo un formulario que sube imagenes y muestra un preview de estas y me gustaría hacer un botón para limpiar el input.

He estado buscando varias soluciones pero de momento ninguna me ha servido. Ahora mismo estoy probando lo siguiente:

    window.resetMethod =
    function (e) {
        var input = $(this).parent('div').find('input[type=file]');
        input.val('');
        input.html($('input[type=file]').clone(true));
        return false;
    }
 

No funciona ninguno de los dos, ni el val() ni el clone().

<div class="first">
    <!-- este div es creado por el plugin ezdz y es donde aparece el preview -->
    <div>Drop a file</div>
    <input type="file" name="file[]" accept="image/jpeg" />
    <div class="arrow_box hide"><a href="#" onClick="return resetMethod($(this));">Quitar imagen</a></div>
</div>

Pero no está funcionando. ¿Hay algún problema con el código? Alomejor se puede hacer de otra manera, incluso más sencillo.

Gracias!

Si cierto, es muy raro xD

Voy a quitar el onclick y usar JQuery click(). No sé porque me complico tanto si es muy sencillo. Voy a probar y ahora edito.

Vale ahora si que funciona:

$('body').on('click', 'a', function() {
    console.log('click works');
    div = $(this).parent().parent();
    div.find('input[type=file]').val('');
    div.children().first().removeClass('ezdz-enter ezdz-accept');
    div.find('div div').html('Arrastrar imagen');
    div.find('.arrow_box').addClass('hide');
});

Y yo complicandome la vida...