اصفهان - گلپایگان - میدان بسیج - مجتمع تجاری پارسیان - طبقه اول انتهای راهرو خدمات ژوپین پ 136
031-57453161   09130246374   @ info[at]zhupin[dot]ir  



ایجاد فیلد رنج برای رنج قیمت به کمک پلاگین jquery


ایجاد فیلد رنج برای رنج  یا محدوده قیمت به کمک پلاگین jquery

 فیلد رنج قیمت با html و jquery

دوستانی سوال کرده بودند چطور اسلاید محدوده قیمت برای فروشگاه بخش فیلتر درست کنیم.

خب برای این دسته از دوستان که نیاز دارند تا یک رنج حالا رنج قیمت یا هر رنج دیگه ای را ایجاد کنند این آموزش را تهیه کردیم

ابدا موارد زیر را اینکلود کنید 

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

حال کد های زیر این اسلاید را برای شما می سازد

 

<div data-role="rangeslider">
        <label for="price-min">Price:</label>
        <input type="range" name="price-min" id="price-min" value="200" min="0" max="1000">
        <label for="price-max">Price:</label>
        <input type="range" name="price-max" id="price-max" value="800" min="0" max="1000">
      </div>

دیگه attr های اینپوت ها مشحص هست چی را بیان میکنند 

مثلا value="200" بیان میکند پیش فرض دستگیره اول 200 باشد و max هم میگوید نهایت چه مقدار بتواند بگیرد

 

مثال زیر را ببینید

https://www.w3schools.com/jquerymobile/tryit.asp?filename=tryjqmob_forms_slider_range

 


1397/11/12 16:05:24      طراحی سایت    57 بار    اشتراک در تلگرام    https://www.zhupin.ir/post/43

نظرات

مهدی طبسی
مهدی طبسی گفت :   (نقل قول)

ممنون واقعا دنبالش بودم


1397/11/20 - 9:56:54


کد امنیتی :

2 ضرب در 4