jQuery Mobile formulär - reglage

jQuery Mobile glidarkontroll

Glidaren låter dig välja ett värde från ett visst intervall av nummer:

För att skapa en glidare, använd <input type="range">:

Exempel

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

Prova själv

Använd följande egenskaper för att specificera begränsningar:

  • max - anger tillåtet högsta värde
  • min - anger tillåtet minsta värde
  • step - anger giltiga numeriska intervall
  • value - anger standardvärdet

Tips:Om du vill betona den här banan för växelslidsrättsvärden, lägg till data-highlight="true":

Exempel

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

Prova själv

Växlingsswitch

Växlingsswitch används ofta för på/av eller ja/nej-knappar:

För att skapa en växling, använd <select>-elementet med data-role="slider" och lägg till två <option>-element:

Exempel

<form method="post" action="demoform.asp">
  <div data-role="fieldcontain">
    <label for="switch">Växla switch:</label>
    <select name="switch" id="switch" data-role="slider">
      <option value="on">På</option>
      <option value="off">Av</option>
    </select>
  </div>
</form>

Prova själv

Tips:Använd "vald"-egenskapen för att sätta en av alternativen som fördefinierad (utmarkerad):

Exempel

<option value="off" vald>Off</option>

Prova själv