با استفاده از JavaScript یک لیست وظایف بسازید که آیتمها را با کشیدن و رها کردن (Drag & Drop) قابل مرتبسازی کند.
3.0 بازدید آخرین ویرایش در 221 روز قبل ساعت 01:38 0.0
برای پیادهسازی از HTML/CSS برای نمایش لیست و از API داخلی HTML5 Drag & Drop در JavaScript استفاده کنید: به هر آیتم event listenerهای dragstart، dragover، drop و dragend اضافه کنید، در dragstart داده یا مرجع عنصر کشیدهشونده را نگه دارید و در dragover با e.preventDefault() اجازه رهاسازی را بدهید، سپس در drop عنصرها را با insertBefore یا replace جایگشت کنید. از اضافهکردن کلاسهای CSS مانند .dragging برای نمایش بازخورد بصری استفاده کنید و در صورت نیاز با localStorage ترتیب جدید را ذخیره کنید تا پس از بارگذاری مجدد صفحه حفظ شود.
توسط پژوهشگر در 221 روز قبل ساعت 01:38 1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
برای پیادهسازی Drag & Drop مرتبسازی با HTML5، از dragstart برای ذخیره مرجع آیتم کشیدهشده و در dragover با e.preventDefault() اجازه رهاسازی بدهید. در drop با insertBefore یا جایگذاری مناسب آیتمها را جابهجا کنید و با افزودن کلاس .dragging بازخورد بصری بدهید. اگر میخواهید ترتیب پس از بارگذاری مجدد حفظ شود، مقدار جدید را در localStorage ذخیره کنید و در بارگذاری دوباره بازیابی کنید. نکته: در برخی مرورگرها رفتار Drag & Drop تفاوت دارد؛ برای سازگاری از dataTransfer.setData استفاده کنید یا شناسه آیتمها را منتقل کنید.
گزارش