jQuery Mobile Formalar - Kaydırma

jQuery Mobile Slayt Kontrolü

Slayt, belirli bir sayı aralığından bir değer seçmenize olanak tanır:

Slayt oluşturmak için <input type="range"> kullanın:

Örnek

<form method="post" action="demoform.asp">
  <div data-role="fieldcontain">
    <label for="points">Puanlar:</label>
    <input type="range" name="points" id="points" value="50" min="0" max="100">
  </div>
</form>

Kişisel Olarak Deneyin

Sınırlamaları belirlemek için aşağıdaki özellikleri kullanın:

  • max - izin verilen en büyük değer
  • min - izin verilen en küçük değer
  • step - geçerli sayı aralığı
  • value - varsayılan değer

İpucu:Eğer sona kadar kayan slayt değerini vurgulamak istiyorsanız, data-highlight="true" ekleyin:

Örnek

<input type="range" data-hightlight="true">

Kişisel Olarak Deneyin

Düğme aç/kapalı

Düğme aç/kapalı veya doğru/yanlış düğmeleri için sıkça kullanılır:

Eğer bir düğme oluşturmak istiyorsanız, data-role="slider" olan <select> öğesini kullanın ve iki <option> öğesi ekleyin:

Örnek

<form method="post" action="demoform.asp">
  <div data-role="fieldcontain">
    <label for="switch">Toggle Switch:</label>
    <select name="switch" id="switch" data-role="slider">
      <option value="on">On</option>
      <option value="off">Off</option>
    </select>
  </div>
</form>

Kişisel Olarak Deneyin

İpucu:"seçili" özelliğini kullanarak bir seçenek之一 ön planda (vurgulama) olarak ayarlayın:

Örnek

<option value="off" seçili>Off</option>

Kişisel Olarak Deneyin