https://virgool.io/feed/@akbarpour یک توسعه دهنده وب fa 2026-04-15 09:58:21 https://files.virgool.io/upload/users/33940/avatar/l0f3EV.png?height=120&width=120 https://virgool.io/@akbarpour https://virgool.io/cheyab-blog/%D9%87%D8%B1%D8%B3%D8%A7%DB%8C%D8%AA%DB%8C-%D8%B1%D9%88-%D8%AA%D8%BA%DB%8C%DB%8C%D8%B1-%D8%A8%D8%AF%D9%87-%D8%A8%D8%B1%D8%A7%DB%8C-%D8%AE%D9%88%D8%AF%D8%AA-%D8%AD%D8%AA%DB%8C-%D8%AF%DB%8C%D9%88%D8%A7%D8%B1-itqsroghqh0w خرید ماشین همیشه یکی از دغدغه ها بوده که به لطفا شرایط اقتصادی و تورم و..... هر چقدر پس از انداز می کنیم تا پس اندازمون برای خرید ماشین صفر کافی میشه ، ماشین گرون تر میشه ، و باز دوباره همین چرخه تکرار میشه . پس دیگه باید بیخیال خرید ماشین صفر کیلومتر بشیم و به فکر خرید ماشین کارکرده دست دوم باشیم .حالا باید به دنبال یه ماشین دست دوم بگردیم .از حق نگذریم یکی از محبوب ترین راهای پیدا کردن ماشین کارکرده همین سایت دیوار است.دیوار یکی از پر آگهی ترین ( البته نه راحت ترین) نیازمندی های کشور است.یکی از نکات مهمی که بارها توسط اطرافیان به ما گوشزد می شود ، خرید ماشین با شاسی ها سالم است .اما چطور ماشین های با شاسی سالم پیدا کنیم. درحال حاضر ،سایت دیوار باز کنیم بریم براساس قیمت و سال ساخت با استفاده از فیلتر جستجو کنیم . و با توجه به اینکه هیچ امکانی برای فیلتر وضعیت بدنه ، وضعیت شاسی ها وجود ندارد. باید تک به تک سایت آگهی را باز کنیم و بررسی کنیم .ولی ، یا راهی پیدا خواهم کرد یا راهی خواهم ساختچون من یک مهندس ، یک توسعه دهنده هستمحتما پلاگین فونت آرا دیدید ، پلاگینی که با نصب بروی مرورگر کروم ، فونت هر سایتی رو میتونید عوض کنید.با خودم گفتم همانگونه که فونت آرا فونت سایت ها را تغییر میده ، منم دیوار تغییر بدم ، البته نه صرفا تغییر فونتپس باید تغییر بدم که بتونم جزئیات آگهی را در همان صفحه ببینم فقط با حرکت موسبرای اینکار لازم بود یه پلاگین برای کروم بنویسیم .تنها فقط کافیست جاوا اسکریپت ، css ، html بلد باشیم ...مراحل کار :ابتدا یک پوشه با نام divar درست میکنیم و فایل های زیر در داخل آن ایجاد و محتوا را داخل فایل کپی می کنیم..manifest.json{ &quotmanifest_version&quot: 2, &quotname&quot: &quotنمایش سریع آگهی دیوار&quot, &quotdescription&quot: &quotنمایش سریع آگهی دیوار این پلاگین توسط دیوار توسعه داده نشده ، غیر رسمی می باشد.&quot, &quotversion&quot: &quot0.0.0.1&quot, &quotbrowser_action&quot: { &quotdefault_icon&quot: &quoticon.png&quot }, &quotcontent_scripts&quot: [ { &quotall_frames&quot: true, &quotjs&quot: [ &quotcontent.js&quot ], &quotmatches&quot: [ &quothttp://divar.ir/*&quot, &quothttps://divar.ir/*&quot ] } ], &quotpermissions&quot: [ &quothttp://divar.ir/*&quot, &quothttps://divar.ir/*&quot ]content.jsdocument.addEventListener('mouseover', function(e){ if(e.target && e.target.classList.contains('kt-image-block__image')){ document.querySelector(&quot.sticky-outer-wrapper&quot).style.display=&quotblock&quot var ida =(e.target.parentElement.parentElement.parentElement.parentElement.getAttribute('href').split(&quot/&quot).pop()); fetch('https://api.divar.ir/v5/posts/'+ida) .then(response => response.json()) .then(data => addtable(&quoti&quot,data.widgets)); } }); document.addEventListener('mouseout', function(e){ console.log(e.target.className); if(e.target && e.target.classList.contains('kt-image-block__image')){ document.querySelector(&quot.sticky-outer-wrapper&quot).style.display=&quotnone&quot } }); function addtable(t,j) { var str=&quot&quot j.list_data.forEach( function (item, index,t) { console.log(item); if(item.value) { if(item.title==&quotوضعیت شاسی جلو&quot || item.title== &quotوضعیت شاسی‌ها&quot) { if(item.value==&quotسالم و پلمپ&quot) { item.value= item.value + &quot✅ &quot ; } else { item.value= item.value + &quot❌ &quot ; } str=str +(&quot&quot + item.title +&quot:&quot + item.value + &quot<br>&quot); } else { str=str +(&quot&quot + item.title +&quot:&quot + item.value + &quot<br>&quot); } } } ); j.description=j.description.replace( &quotخوردگی&quot, &quotخوردگی ❌ &quot ) str = str + &quot &quot + j.description; document.querySelector(&quot.sticky-outer-wrapper&quot)=str; } var div = document.createElement(&quotdiv&quot); div.classList.add (&quotsticky-outer-wrapper&quot); div.style.position=&quotfixed&quot div.style.width=&quot300px&quot div.style.height=&quotauto&quot div.style.top=&quot70px&quot div.style.lineHeight=&quot28px&quot div.style.right=0; div.style.background=&quot#f00&quot div.style.color=&quot#fff&quot div.style.padding=&quot5px 10px&quot document.body(div);icon.pngتصویر دلخواه با پسوند pngخب حالا کافیه لینک زیر در مرورگر کپی کنیم .chrome://extensions/از گوشه بالا سمت راست Developer Mode فعال میکنیم . از سمت چپ بروی یک گزینه Load Unpacked کلیک کنید و پوشه ای که قبلا ساختیم را انتخاب می کنیم.و پلاگین را فعال کنید.حالا سایت دیوار باز کنید و موس رو بروی تصویر آگهی ببرید . تا جزئیات آگهی را در سمت راست صفحه در کادر قرمز مشاهده کنید.خروجی نهاییامیدوارم دیوار قابلیت فیلتر وضعیت بدنه و وضعیت شاسی را اضافه کند ، تا همه بتوانند به راحتی استفاده کنند.سوالی بود در خدمتم. محمد حسین اکبرپور محمد حسین اکبرپور Sat, 07 Aug 2021 18:08:53 +0430 https://virgool.io/@akbarpour/%D8%A7%D8%B1%D8%B3%D8%A7%D9%84-%D9%81%D8%B1%D9%85-%D8%A8%D8%A7-%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87-ajax-kly3mjwtfdig بدون مقدمه ...برای اینکه اطلاعات یک فرم را بدون رفرش صفحه ارسال کنیم از ایجکس استفاده می کنیم . گام صفر : اضافه کردن کتابخانه جی کوئری برای استفاده از Ajax ابتدا باید jquery در فوتر اضافه کنیم <script type="application/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"/> گام یک : تعریف id برای فرم مربوطه برای اینکه با جی کوئری بتوانیم به مقادیر فرم دسترسی داشته باشیم.برای فرم مورد نظر شناسه id تعریف می کنیم .برای مثال : form1 <form id="form1" > <label>title</label> <input name="mha" id="mha"> <input type="submit"> </form> گام دوم: ارسال اطلاعات با ایجکسکد های زیررا داخل تگ script قراردهید. $('#form1').submit(function (event) { event.preventDefault(); // غیرفعال سازی ارسال فرم به صورت عادی $.ajax({ url: "/Blog/Add", type: "POST", data: $(this).serialize() , // اطلاعات فرم جاری success: function (data) { alert(data); } }); خب کار تمام شدولی اگر بخواین اینکار برای چند فرم انجام بدید حجم کد هاتون زیاد میشه . می توانید با استفاده از کد های زیر به راحتی چندین فرم را ایجکسی نمایید. گام یک : کلاس مربوطه را به فرم اختصاص بدید. مثلا کلاس : form_ajaxi<form class="form_ajaxi" method="post" action="/Blog/Add" > گام دوم : تگ script به کد های زیر تغییر بدید. $(function () { $('.form_ajaxi').submit(function (event) { event.preventDefault(); $.ajax({ url: $(this).attr("action") , type: $(this).attr("method"), data: $(this).serialize() , success: function (data) { alert(data); } }); }); }); محمد حسین اکبرپور محمد حسین اکبرپور Mon, 10 Jun 2019 22:31:36 +0430