如何删除表单输入数据点击复选框？

如果用户正在选择文件，并且之后如果用户取消选中复选框比文件也在那里，所以我想使它像一个当用户取消选中复选框比之后文件必须删除。我怎么做到的？哪个事件处理程序适用于复选框？ HTML代码：如何删除表单输入数据点击复选框？

<div class="checkbox"> 
    <label for="email">electronics 
    <input type="checkbox" name="product_category[]" value="electronics" id="product_category" class="electronics"> 
    </label> 
</div> 
<div class="form-group" id="efileu" style="display:none;" > 
    <input type="file" name="checkboxfile0" id="efile" style="width:100%"> 
</div> 
<div class="checkbox"> 
    <label for="email">kitchen 
    <input type="checkbox" name="product_category[]" value="kitchen" id="product_category" class="kitchen"> 
</div> 
<div class="form-group" id="kfileu" style="display:none;" > 
    <input type="file" name="checkboxfile1" id="kfile" style="width:100%"> 
</div> 

<script> 
$(".electronics").click(function(){ 
    if(!$("#efileu").is(":visible")){ 
     $("#efileu").show(); 
    } 
    else{ 
     $("#efileu").hide(); 
     $("#efileu").val(); 
    } 

}); 
$(".kitchen").click(function(){ 
    if(!$("#kfileu").is(":visible")){ 
     $("#kfileu").show(); 
    } 
    else{ 
     $("#kfileu").hide(); 
    } 

}); 
</script>

来源

2016-09-25 shah rushabh

缺少''厨房 –

如果你想删除'input.file'对象的值，你应该使用'$（“＃efileu input”）。val（“”）;'清除它的值。请参阅https://jsfiddle.net/shaoran/rathxw43/ – Pablo

似乎只使用'.val（“”）'是不够的，请参阅http://stackoverflow.com/questions/1043957/clearing-input-type -file-using-jquery – Pablo

使用jQuery在你的现有代码这一条线，似乎没什么问题

else{ 
    $("#efileu").hide(); 
    $("#efileu").replaceWith($("#efileu").val('').clone(true)); //clear the values 
} 

else{ 
    $("#kfileu").hide(); 
    $("#kfileu").replaceWith($("#kfileu").val('').clone(true));//clear the values 
}

来源

2016-09-25 03:33:47

感谢他为我工作。 –

找到一个可行的解决方法：

$(".electronics").click(function() { 
    if (!$("#efileu").is(":visible")) { 
     $("#efileu").show(); 
    } else { 
     var $el = $('#efileu'); 
     $el.wrap('<form>').closest('form').get(0).reset(); 
     $el.unwrap(); 
     $("#efileu").hide(); 
    }

这里有一个JSFiddle看到它在行动。积分为Gyrocode。

来源

2016-09-25 02:23:58

如何删除表单输入数据点击复选框？

回答

相关问题