How do I empty an input value with jQuery?

I’m trying to make a modal dialog with images where you can select multiple images. I need to get values from an input and then to empty it, but I cannot empty the input. I tried .val('') and .val(null), but neither worked for me.

Here is the full code:

$("#hdselect").click(function(){
$(".modal").html("");


$.post('mediaservice.php',{hd:'ok',images:$("#hdimages").val()},function(data){
$(".modal").append(data);
});
$(".modal").dialog({
'modal':true,
'title':"Click the image to select",
'width':960,
'height':600,
'resizable':false,
'show': {effect: 'drop', direction: "up"},
'buttons': {"Ok": function() {
var hd=Array();
var hdval=$("#hdimages").val();
$("#hdimages").attr('value',' ');
$("input[name='hd[]']:checked").each(function(){
hd.push($(this).val());
});
if(hdval!=''){
hdval=hdval+","+hd;
}else{
hdval=hd;
}
$("#hdimages").val(hdval);
var images=$("#hdimages").val();
$.post('mediaservice.php',{getHd:images},function(data){
$("#imgthumbBase").append(data);
});
$(this).dialog("close");
}
}
});
});

The idea is that the user clicks a button and a modal dialog opens with multiple images and checkboxes. At this point I need to get the values from an input, and then clear it.

320140 次浏览

To make values empty you can do the following:

 $("#element").val('');

To get the selected value you can do:

var value = $("#element").val();

Where #element is the id of the element you wish to select.

You could try:

$('input.class').removeAttr('value');
$('#inputID').removeAttr('value');

Usual way to empty textbox using jquery is:

$('#txtInput').val('');

If above code is not working than please check that you are able to get the input element.

console.log($('#txtInput')); // should return element in the console.

If still facing the same problem, please post your code.

Another way is:

$('#element').attr('value', '');

A better way is:

$("#element").val(null);
$('.reset').on('click',function(){
$('#upload input, #upload select').each(
function(index){
var input = $(this);
if(input.attr('type')=='text'){
document.getElementById(input.attr('id')).value = null;
}else if(input.attr('type')=='checkbox'){
document.getElementById(input.attr('id')).checked = false;
}else if(input.attr('type')=='radio'){
document.getElementById(input.attr('id')).checked = false;
}else{
document.getElementById(input.attr('id')).value = '';
//alert('Type: ' + input.attr('type') + ' -Name: ' + input.attr('name') + ' -Value: ' + input.val());
}
}
);
});

For me this was the best way to solve this:

$('yourElementName').val(null);