У меня есть вход для файла (картинка), и я хочу установить его div
class
в зависимости от того, что больше: его width
или его height
.Сравнение ширины и высоты загруженного изображения
Мой код не работает (только последний оператор if
), класс div
никогда не изменяется, независимо от загруженного изображения.
Это мой HTML:
<div class="row">
<div class="col-md-12">
<div id="blah" class="profilePic">
<img src="profilkep.jpg" />
</div>
</div>
</div>
<br>
<div class="row">
<div class="col-md-12">
<input type="file" onchange="previewFile()">
</div>
</div>
И это мой JavaScript:
function previewFile(){
var preview = document.querySelector('img'); //selects the query named img
var file = document.querySelector('input[type=file]').files[0]; //sames as here
var reader = new FileReader();
reader.onloadend = function() {
preview.src = reader.result;
}
if (file) {
reader.readAsDataURL(file); //reads the data as a URL
} else {
preview.src = "";
}
if (file.width < file.height) {
document.getElementById("blah").setAttribute("class", "blahblah");
} else {
document.getElementById("blah").setAttribute("class", "profilePic");
}
}
Спасибо, хороший момент, я удалил второй, но он все еще не работает. – user6725906
Что вы подразумеваете под undefined? – user6725906
Посмотрите на мой ответ сейчас, он работает. file.width не определено в то время, когда вы его просили –