jquery:
- Usando el método de ajuste en jquery:
la mejor manera de restablecer el tipo de entrada = archivo es restablecer todo el formulario. Envuelva <tipo de entrada = «archivo»> en las etiquetas <formulario> y restablezca el formulario:
Ejemplo-1:
html
<!DOCTYPE html>
<html>
<head>
<title>reset input type = “file”</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<!-- jQuery code to show the
working of this method -->
<script>
$(document).ready(function() {
$('#resetbtn').on('click', function(e) {
var $el = $('#infileid');
$el.wrap('<form>').closest(
'form').get(0).reset();
$el.unwrap();
});
});
</script>
</head>
<body>
<center>
<h2 style="color:green">GeeksforGeeks</h2>
<form id="find" name="formname">
<p>
<label>File</label>
<input id="infileid" type="file">
</p>
<p>
<button id="resetbtn"
type="button">
Reset file
</button>
</p>
</form>
</center>
</body>
</html>
- Salida:
Antes:
- Después:
- Usando file.value = ”:
La forma más sencilla de restablecer la entrada es cambiar el valor rellenado sin nada. este método funciona en todos los navegadores.
Ejemplo-2:
HTML
<!DOCTYPE html>
<html>
<head>
<title>
reset input type = “file”
</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<!-- jQuery code to show the
working of this method -->
<script>
function resetFile() {
const file =
document.querySelector('.file');
file.value = '';
}
</script>
</head>
<body>
<center>
<h2 style="color:green">
GeeksforGeeks
</h2>
<input type="file" class="file" />
<button onclick="resetFile()">
Reset file
</button>
</center>
</body>
</html>
- Salida:
Antes:
- Después:
- Usando el método wrap en jquery:
Wrap <input type = “file”> en las etiquetas <form> y reinicie el formulario:
Ejemplo-3:
html
<!DOCTYPE html> <html> <head> <title> reset input type = “file” </title> </head> <body> <center> <h2 style="color:green"> GeeksforGeeks </h2> <form id="find" name="formname"> <p> <label>File</label> <input type="file"> </p> <p> <button id="resetbtn" type="button" onClick="this.form.reset()"> Reset file </button> </p> </form> </center> </body> </html>
- Salida:
Antes:
- Después:
Publicación traducida automáticamente
Artículo escrito por Vijay Sirra y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA