niwanta 8 ارسال شده در اردیبهشت 96 گزارش بازنشر ارسال شده در اردیبهشت 96 سلام به همه دوستان من اگه بخوام یه تگ آپلود فایل با یه باکس بزارم هنگامی که عکسی انتخاب میشه تو اون باکس نشون بده و دوباره روی تگ کلیک کنم و کنسل کنم که قاعدتا فایل انتخابی پاک میشه و باید در اون باکس هم پاک بشه ای چیزی که من میخوام چند خطی کد نیازه اما مورد مهمش اینه اگه بخوام از این کپی بگیرم و به 6 تا اضافه کنم نمی تونم به صورت داینامیک کدشو بزنم بلکه باید دوباره برای هر کدوم آیدی و کلس مجزا استفاده کنم از نو فراخونی کنم راهی هست که هر چند تا تگ فایل و باکس کپی بگیرم یا همون یه دستور اول ست در بیاد و نیاز نباشه چند بار کد های جی کوئری رو کپی کنم!؟ نقل قول لینک به ارسال
Mobin 1669 ارسال شده در اردیبهشت 96 گزارش بازنشر ارسال شده در اردیبهشت 96 هم میتونین از قابلیت چند انتخاب input file استفاده کنین هم اینکه میتونین یک دکمه بزارید که با کلیک یک باکس جدید ایجاد بشه 1 نقل قول لینک به ارسال
niwanta 8 ارسال شده در اردیبهشت 96 مالک گزارش بازنشر ارسال شده در اردیبهشت 96 ببینید من 6 تا تگ اینپوت میخوام + عکس تامنیلشون که قبل از آپلود نشون میده اولی رو نوشتم که عکس رو نشون بده و در صورت کنسل عکس پاک بشه و ... بعد از تگ های html یک کپی گرفتم همه استایل داشتن اما روی یکیشون تنها کار میکرد و اون یکی تداخل پیدا کرد در نتیجه برای کدهای جی کوئری اومدم جدا جدا برای هر 6 تا نوشتم که اصلا کار منطقی نیست! تنها میخوام کد های جی کوئریم یکی باشه اما هر چی از این تگ ها کپی کردم اون توابع روش اعمال بشه! نقل قول لینک به ارسال
Mobin 1669 ارسال شده در اردیبهشت 96 گزارش بازنشر ارسال شده در اردیبهشت 96 کدهای html همین بخش و jquery اونو اینجا قرار بدین نقل قول لینک به ارسال
niwanta 8 ارسال شده در اردیبهشت 96 مالک گزارش بازنشر ارسال شده در اردیبهشت 96 <div class="upload-box"> <label>تصاویر آگهی</label> <span class="span-fine-upload">فرمت های مجاز jpg , jpeg , png , gif</span> <div id="fine-uploader-gallery"> <div class="bg-custom-input-file"> <div class="custom-input-file-box"> <div class="custom-input-file-img-block"> <img id="image1" src="images/no-img.jpg" alt="your image"> <button class="delete-upload-file" type="button" id="delete1">حذف تصویر</button> </div> <input class="insert-ads-file" type="file" id="files1" accept=".jpg,.png,.gif,.jpeg"> </div> <div class="custom-input-file-box"> <div class="custom-input-file-img-block"> <img id="image2" src="images/no-img.jpg" alt="your image"> <button class="delete-upload-file" type="button" id="delete2">حذف تصویر</button> </div> <input class="insert-ads-file" type="file" id="files2" accept=".jpg,.png,.gif,.jpeg"> </div> <div class="custom-input-file-box"> <div class="custom-input-file-img-block"> <img id="image3" src="images/no-img.jpg" alt="your image"> <button class="delete-upload-file" type="button" id="delete3">حذف تصویر</button> </div> <input class="insert-ads-file" type="file" id="files3" accept=".jpg,.png,.gif,.jpeg"> </div> <div class="custom-input-file-box"> <div class="custom-input-file-img-block"> <img id="image4" src="images/no-img.jpg" alt="your image"> <button class="delete-upload-file" type="button" id="delete4">حذف تصویر</button> </div> <input class="insert-ads-file" type="file" id="files4" accept=".jpg,.png,.gif,.jpeg"> </div> <div class="custom-input-file-box"> <div class="custom-input-file-img-block"> <img id="image5" src="images/no-img.jpg" alt="your image"> <button class="delete-upload-file" type="button" id="delete5">حذف تصویر</button> </div> <input class="insert-ads-file" type="file" id="files5" accept=".jpg,.png,.gif,.jpeg"> </div> <div class="custom-input-file-box"> <div class="custom-input-file-img-block"> <img id="image6" src="images/no-img.jpg" alt="your image"> <button class="delete-upload-file" type="button" id="delete6">حذف تصویر</button> </div> <input class="insert-ads-file" type="file" id="files6" accept=".jpg,.png,.gif,.jpeg"> </div> </div> </div> </div> // Custom Input File document.getElementById("files1").onchange = function () { var reader = new FileReader(); reader.onload = function (e) { // get loaded data and render thumbnail. document.getElementById("image1").src = e.target.result; }; // read the image file as a data URL. reader.readAsDataURL(this.files[0]); }; document.getElementById("files2").onchange = function () { var reader = new FileReader(); reader.onload = function (e) { // get loaded data and render thumbnail. document.getElementById("image2").src = e.target.result; }; // read the image file as a data URL. reader.readAsDataURL(this.files[0]); }; document.getElementById("files3").onchange = function () { var reader = new FileReader(); reader.onload = function (e) { // get loaded data and render thumbnail. document.getElementById("image3").src = e.target.result; }; // read the image file as a data URL. reader.readAsDataURL(this.files[0]); }; document.getElementById("files4").onchange = function () { var reader = new FileReader(); reader.onload = function (e) { // get loaded data and render thumbnail. document.getElementById("image4").src = e.target.result; }; // read the image file as a data URL. reader.readAsDataURL(this.files[0]); }; document.getElementById("files5").onchange = function () { var reader = new FileReader(); reader.onload = function (e) { // get loaded data and render thumbnail. document.getElementById("image5").src = e.target.result; }; // read the image file as a data URL. reader.readAsDataURL(this.files[0]); }; document.getElementById("files6").onchange = function () { var reader = new FileReader(); reader.onload = function (e) { // get loaded data and render thumbnail. document.getElementById("image6").src = e.target.result; }; // read the image file as a data URL. reader.readAsDataURL(this.files[0]); }; $( "#delete1" ).click(function() { $('#files1').val(''); document.getElementById("image1").src = "images/no-img.jpg"; }); $( "#delete2" ).click(function() { $('#files2').val(''); document.getElementById("image2").src = "images/no-img.jpg"; }); $( "#delete3" ).click(function() { $('#files3').val(''); document.getElementById("image3").src = "images/no-img.jpg"; }); $( "#delete4" ).click(function() { $('#files4').val(''); document.getElementById("image4").src = "images/no-img.jpg"; }); $( "#delete5" ).click(function() { $('#files5').val(''); document.getElementById("image5").src = "images/no-img.jpg"; }); $( "#delete6" ).click(function() { $('#files6').val(''); document.getElementById("image6").src = "images/no-img.jpg"; }); کد رو ببینید اصلا خنده داره! نقل قول لینک به ارسال
niwanta 8 ارسال شده در اردیبهشت 96 مالک گزارش بازنشر ارسال شده در اردیبهشت 96 دوستان کسی کمک بکنه نقل قول لینک به ارسال
Mobin 1669 ارسال شده در اردیبهشت 96 گزارش بازنشر ارسال شده در اردیبهشت 96 بهتره از jquery استفاده کنی تا بتونی از کلاسها بجای ایدی استفاده کنی اینجوری نیاز نیست یه کد رو برای هر بلاک تکرار کنی 1 نقل قول لینک به ارسال
niwanta 8 ارسال شده در اردیبهشت 96 مالک گزارش بازنشر ارسال شده در اردیبهشت 96 خوب استاد عزیز مشکل اینجاست که من جی کوئری زیاد نمی دونم! اگه محبت کنی کمک کنی ان شا الله بتونم جبران کنم نقل قول لینک به ارسال
Mobin 1669 ارسال شده در اردیبهشت 96 گزارش بازنشر ارسال شده در اردیبهشت 96 میتونین از اسکریپت زیر استفاده کنید جی کوئری رو قبلش لود کنید <script type="text/javascript"> var img = null; jQuery('body').on('change','.insert-ads-file',function(){ img = jQuery(this).closest('.custom-input-file-box').find('img') var reader = new FileReader(); reader.onload = function (e) { img.attr('src', e.target.result).height(200); }; reader.readAsDataURL(jQuery(this)[0].files[0]); }); jQuery('body').on('click','.delete-upload-file',function(){ jQuery(this).prev('img').attr('src','images/no-img.jpg'); }); </script> 1 نقل قول لینک به ارسال
پست های پیشنهاد شده
به گفتگو بپیوندید
هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .