2016-03-15 2 views
3

Так что я не могу понять, как проверить мою форму, чтобы убедиться, что их файл выбран до того, как пользователь может перейти. Я видел несколько примеров, но по какой-то причине они работают только в Internet Explorer.Выбранный файл HTML/JavaScript Файл

Любая помощь была бы принята с благодарностью, спасибо!

Вот мой текущий HTML лист:

<!DOCTYPE html> 
<html> 
<head> 
<title>Upload Page</title> 

<script> 
function validateForm() { 
    var x = document.forms["myForm"]["title"].value; 
    if (x.length < 3) { 
     alert("Title Needs To Be At Least 3 Characters Long"); 
     return false; 
    } 

    var y = document.forms["myForm"]["lotsoftext"].value; 
    if (y.length == 0) 
    { 
     alert("Caption Must Not Be Empty"); 
     return false; 
    } 

} 
</script> 
</head> 
<body> 
    <h1><center><img src="Images/Drawing.png" onload="loadImage()" width="500" height="169"></center></h1> 
    <center> 
    <form name="myForm" action="Homepage.html" onsubmit="return validateForm();" method="GET"> 

    Photo Title: <input type="text" name="title"> 
    <br> 
    <input type="file" name="upload" id="upload"> 
    <br><br><br> 
    Caption: <textarea rows="10" cols="20" name="lotsoftext"></textarea> 
    <a class="btn" href="Homepage.html"></a> 
    <input type="submit" value="Upload"> 
</form>  
    <a href="Homepage.html">Cancel</a> 
</center> 
</body> 
<script> 
function loadImage() { 
    alert("Image is loaded"); 
} 
</script> 
</html> 
+0

Есть ли у вас что-нибудь против использования JQuery? – Blindsyde

ответ

2

Вы можете просто добавить атрибут required на вход файла, т.е.

<input type="file" name="upload" id="upload" required>

+0

приятно, что должно быть новым с html5, чему-то научился. – Blindsyde

+0

@Jan Perfect, именно то, что я искал! Спасибо! – LearningProcess

0

Когда вы загружаете что-то значение <input type="file" > - путь к загруженному файлу.

Чтобы проверить это, вы можете сделать что-то вроде этого:

<input type="file" name="upload" id="upload"> 

<script> 
    if (document.getElementsByName('upload')[0].value.length > 0) { 
     //there is a path, so something is uploaded 
    } else { 
     alert('You have to upload something!') 
    } 
</script> 

Вы можете подключить, если заявление в были когда-либо вы делаете вашу форму проверки. Это также можно использовать, чтобы убедиться, что файл является определенным типом, т.е. файл 'png' или файл 'jpeg'.

пример того, что document.getElementsByName('upload')[0].value возвращений: C:\fakepath\randomimage.png

Смежные вопросы