나는 하나의 파일 업로드 양식 필드가 있습니다. 여기에 파일을 선택하지 않고 오류 메시지를 표시하고 싶다는 의미입니다.이 코드에서 아무 파일이나 선택하면 정상적으로 작동합니다. 오류 메시지를 숨기고 싶다는 것을 의미합니다. 방법을 모르겠습니다. 이 작업을 수행???
$("#horoscope_form").submit(function(e) {
e.preventDefault();
var filename = document.forms["myForm"]["Filename"].value;
if (filename == null || filename == "") {
$("#fileselect_error").show();
return false;
} else {
var filename = document.getElementById("myFile").value;
alert(filename);
$("#fileselect_error").hide();
return false;
}
});
<form method="post" enctype="multipart/form-data" class="form-horizontal" style="margin-top: 20px;" id="horoscope_form" name="myForm">
<div class="form-group">
<label class="control-label col-xs-3">File Upload</label>
<div class="col-md-9">
<div class="fileupload fileupload-new" data-provides="fileupload">
<div class="input-append">
<div class="uneditable-input">
<span class="fileupload-preview"></span>
</div>
<span class="btn btn-default btn-file" id="fileinput">
<span class="fileupload-exists">Change</span>
<span class="fileupload-new">Select file</span>
<input type="file" id="myFile" name="Filename">
</span>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-3 col-xs-5">
<span id="fileselect_error"><strong >Error!</strong> Please select your file.</span>
</div>
</div>
<div class="form-group">
<div class="col-xs-offset-3 col-md-12">
<button class="btn btn-primary" value="register" type="submit">Upload The Horoscope</button>
</div>
</div>
</form>
변경 사항
$("input:file").change(function (){
console.log($(this).val().trim())// You will get the input value.
if($(this).val().trim().length){
$("#fileselect_error").hide();
}
else{
$("#fileselect_error").show();
}
});
작업 예
$(document).ready(function() {
//$("#fileselect_error").hide();
$("input:file").change(function() {
console.log($(this).val().trim())
if ($(this).val().trim().length) {
$("#fileselect_error").hide();
} else {
$("#fileselect_error").show();
}
});
$("#horoscope_form").submit(function(e) {
e.preventDefault();
var filename = document.forms["myForm"]["Filename"].value;
if (filename == null || filename == "") {
$("#fileselect_error").show();
return false;
} else {
var filename = document.getElementById("myFile").value;
alert(filename);
$("#fileselect_error").hide();
return false;
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post" enctype="multipart/form-data" class="form-horizontal" style="margin-top: 20px;" id="horoscope_form" name="myForm">
<div class="form-group">
<label class="control-label col-xs-3">File Upload</label>
<div class="col-md-9">
<div class="fileupload fileupload-new" data-provides="fileupload">
<div class="input-append">
<div class="uneditable-input">
<span class="fileupload-preview"></span>
</div>
<span class="btn btn-default btn-file" id="fileinput">
<span class="fileupload-exists">Change</span>
<span class="fileupload-new">Select file</span>
<input type="file" id="myFile" name="Filename">
</span>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-3 col-xs-5">
<span id="fileselect_error"><strong >Error!</strong> Please select your file.</span>
</div>
</div>
<div class="form-group">
<div class="col-xs-offset-3 col-md-12">
<button class="btn btn-primary" value="register" type="submit">Upload The Horoscope</button>
</div>
</div>
</form>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다