۴۰۴ Not Found! قیمت ها به ۴۰۳ برگشت! به مدت محدود!
بزن بریم!سلام دوستان..
file input برای تصویر دارم..
میخوام وقتی توی file input یه تصویر انتخاب شد قبل از اینکه اونو توی img نشون بدم از طریق جاوا اسکریپت طول و عرضشو مقایسه کنم اگر برابر بود (تصویر مربعی بود) برام توی img لود کنه در غیر اینصورت alert بده...
هر کار میکنم نمیتونم طول و عرض تصویر اون فایل انتخابی رو بدست بیارم.. ممنون میشم راهنماییم کنید..
سلام به این صورت
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<style>
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }
</style>
</head>
<body>
<input type='file' />
<img id="blah" src="#" alt="your image" />
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js"></script>
<script>
document.querySelector('input').addEventListener('change' , function () {
if (this.files && this.files[0]) {
const reader = new FileReader();
reader.onload = function (e) {
$('#blah').attr('src', e.target.result)
const img = new Image();
img.onload = function() {
console.log(this.width + 'x' + this.height);
}
img.src = e.target.result
};
reader.readAsDataURL(this.files[0]);
}
})
</script>
</body>
</html>
میتونید تصویر رو توی یه المنت img لود بکنی، بعد توی ایونت onload اون image بیا width و height المنت رو بگیر و بعد مثلا src رو خالیش کن یا هرچی
سلام به این صورت
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<style>
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }
</style>
</head>
<body>
<input type='file' />
<img id="blah" src="#" alt="your image" />
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js"></script>
<script>
document.querySelector('input').addEventListener('change' , function () {
if (this.files && this.files[0]) {
const reader = new FileReader();
reader.onload = function (e) {
$('#blah').attr('src', e.target.result)
const img = new Image();
img.onload = function() {
console.log(this.width + 'x' + this.height);
}
img.src = e.target.result
};
reader.readAsDataURL(this.files[0]);
}
})
</script>
</body>
</html>
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟