jQuery plugins - myNumber
jún 25

myNumber

Űrlap beviteli mező

Verzió: 1.0
Kiadás dátuma: 2011/06/23
Fejlesztő: S4 Design
Liszensz: MIT, GPL
  • 1418
  • 9255
  • 0
  • -

Bevezető

Biztos nem ismeretlen jelenség, hogy egy desktop alkalmazás ( pl. Photoshop) használata után az Interneten (hozzá szokva a jóhoz) beleklikkelünk egy űrlap beviteli mezőbe, majd az egérgörgővel próbáljuk a kívánt számadatot bevinni... persze eredménytelenül. Ilyenkor eszmélünk fel a robotmunkából és jövünk rá, hogy az Interneten vagyunk és bizony adatbevitelhez illendő valahonnan egy billentyűzetet is előkotorni.

Ezen idegesítő jelenség kiküszöbölésére szolgál a myNumber plugin, mely az egérgörgő támogatásán túl további hasznos funkciókkal is rendelkezik.

Jellemzők

  • könnyű implementálás
  • kezdeti érték
  • minimum és maximum érték
  • plusz/mínusz gombok
  • kis- és főlépték
  • 4 előre definiált stílus
  • navigációs billentyűk támogatása (navigációs nyilak, pgUp, pgDown, Home, End)
  • adatbevitel egérgörgővel
  • kompatibilitás: Firefox, Opera, Google Chrome, Safari, Internet Explorer 7+

Implementálás

CSS

            <link rel="stylesheet" type="text/css" href="css/style.css" />
          

JavaScript

            <script type="text/javascript" src="js/jquery.js"></script>
            <script type="text/javascript" src="js/jquery.mousewheel.min.js"></script>
            <script type="text/javascript" src="js/jquery.myNumber.1.0.min.js"></script>
          

Deklaráció

            $(document).ready(function(){
              $('#pelda').myNumber();
            }); 
          

Teljes paraméterlista

  • init: a beviteli mező kezdőértéke (alapértelmezett: 0)
  • stepMinor: kislépték (használata: érték csökkentő/növelő gombok, navigációs nyilak) (alapértelmezett: 1)
  • stepMajor: főlépték (használata: egérgörgő, pgUp, pgDown) (alapértelmezett: 5)
  • valueMin: a beviteli mezőben engedélyezett minimális érték (alapértelmezett: null)
  • valueMax: a beviteli mezőben engedélyezett maximális érték (alapértelmezett: null)
  • buttons: érték növelő/csökkentő gombok engedélyezése/tiltása (true | false) (alapértelmezett: true)
  • style: a beviteli mező stílusa (1 | 2 | 3 | 4) (alapértelmezett: 1)

Tippek

  • Az egérgörgő használatához elegendő a kívánt beviteli mező fölé vinni az egeret.
  • A Home és End billentyűk csak érvényes valueMin, illetve valueMax értékek esetén működnek.
  • A plugin csak egész számokkal működik!