Pomohl Vám můj web?
Podpořte psaní dalších článků!

jQuery-návod.cz - vše okolo jQuery - jQuery UI, pluginy a další




FAQ - často kladené otázky

V této části webu naleznete často kladené otázky. Je dobré se sem podívat, než se na něco zeptáte v diskuzi nebo na fóru. Tato stránka se bude aktualizovat podle dotazů na fóru a podle vyhledávání. Část je převzata oficiálního webu.


Jak vybírat podle ID?

Podle vlastnosti ID můžeme vybírat takto:

$('#mujDivId')


Jak vybírat podle třídy?

Podle třídy můžete vybírat takto:

$('.mojeCssTrida')


Jak zjistím, jestli element existuje?

Jestli element existuje můžeme zjistit takto:

if ( $('#myDiv').length) {
     alert("Prvek exsituje");
} else {
     alert("Prvek neexistuje");
}


Jak zjistím, jestli je element viditelný?

Jestli je element viditelný zjistíme tímto kódem:

var jeViditelny = $('#mujDiv').is(':visible');
var jeSchovany = $('#mujDiv').is(':hidden');


Jak povolím nebo zakážu prvek ve formuláři?

Povolení nebo zakázání prvku ve formuláři provedeme takto:

// Zakázání #x
$("#x").attr('disabled', 'disabled');

// Povolení #x
$("#x").removeAttr('disabled');


Jak zaškrtnu checkbox?

Zaškrnout checkbox lze tímto kódem:

// Zaškrtnutí #x
$('#x').attr('checked', true);

// Odškrtnutí #x
$('#x').attr('checked', false);


Jak zjistím vybranou hodnotu v selectu?

Hodnotu, která je aktuálně vybraná v selectu, zjisím tímto kódem:

// Získání aktuální hodnoty v selectu
$("#mujSelect").val();

// Získání aktuální textový popisek v selectu
$("#mujSelect option:selected").text();


Jak podpořím tento web?

Tvorba tohoto webu a článků mě stála spoustu času a úsilí. Pokud se vám tento web líbí, můžete ho podpořit. Provedení nechám na vás, pro mě ale bude pravděpodobně nejlepší finanční odměna. Přispět ale můžete i odkázáním na tento web nebo jinou drobností, případně mi můžete nabídnou práci. Jestli jste se rozhodli tento projekt podpořit, kontaktujte mě.


Jak získám HTML obsah prvku?

HTML obsah prvku můžeme získat tímto kódem:

$("#mujDiv").text();


Jak získám pouze textový obsah prvku?

Textový obsah prvku bez HTML značek získáme takto:

$("#mujDiv").text();


Jak získám hodnotu v inputu?

Hodnotu inputu nebo textarea získáme tímto kódem:

$("#mujInput").val()


Jak uložit výběr do proměnné?

var mujDiv = $('#mujDivId');

Pak s tím můžeme pracovat takto:

mujDiv.hide(500);


Jak zjistím, jestli má prvek určitou třídu?

Jestli má prvek určitou třídu zjistíme tímto kódem:

if ($("mujDiv").hasClass("hledana_trida") ) {
     alert("#mujDiv má třídu hledana_trida");
} else {
     alert("Nemá tuto třídu");
}


Jak změním text prvku?

Text prvku můžeme změnit takto:

$("#mujDiv").text("Nový text");


Jak změním HTML obsah prvku?

HTML obsah můžeme změnit podobně jako text:

$("#mujDiv").html("<b>Nový HTML obsah</b>");


Jak změním hodnotu inputu?

Hodnotu inputu nebo prvku textarea můžeme změnit takto:

$("#mujInput").val("Nová hodnota");


Jak přidám prvek?

Prvek můžeme přidat takto:

$("#mujDiv").after("<div>Nový div</div>");
// za #mujDiv přidá "<div>Nový div</div>"


Jak smažu prvek?

Prvek se maže takto:

$("#mujDiv").remove();
// smaže #mujDiv


Jaký je rozdíl mezi jQuery a JavaScriptem?

JavaScript je programovací jazyk, který je používán v moderních prohlížečích. JQuery je kus kódu napsaný v JavaScriptu a ulehčuje s ním práci.


Nabízí jQuery podmínky?

Ne, v jQuery nic jako podmínky nejsou. Pro používání podmínek potřebujete základní znalosti JavaScriptu.


Jak zjistím rozměry prvku?

Na zjištení rozměrů jQuery nabízí několik funkcí:

// HTML část 
<div id="odstavec"><div> 

// jQuery část
var vyska = $("#odstavec").height(); 
// uložení výšky elementu do proměnné    

var sirka = $("#odstavec").width(); 
// uloženi šířky elementu do proměnné 

Více informací o zjišťování a nastavení rozměrů najdete zde.


Jak zjistím pozici prvku?

Na zjištení pozice prvku nabízí jQuery funkci position.

var pozice = $('#div1').position();
// vytvoří objekt "pozice"

var vzdalenost_zleva =  pozice.left;
// do proměnné uloží pozici 
// prvku od levého okraje stránky

var vzdalenost_shora =  pozice.top;
// do proměnné uloží pozici 
// prvku od horního okraje stránky


Jak obarvím sudé a liché řádky v tabulce?

// HTML část
<table>
   <tr>
          <td>text</td>
          <td>text</td>
          <td>text</td>
   </tr>
   <tr>
          <td>text</td>
          <td>text</td>
          <td>text</td>
   </tr>
   <tr>
          <td>text</td>
          <td>text</td>
          <td>text</td>
   </tr>
   <tr>
          <td>text</td>
          <td>text</td>
          <td>text</td>
   </tr>
</table>

// CSS část
.sudy {
     background-color: blue;
}
.lichy {
     background-color: red;
}

// jQuery část
$("table").find("tr").not(":even").addClass("sudy"); // sudý
$("table").find("tr").not(":odd").addClass("lichy"); // lichý


Nefunguje mi to! V čem je chyba?

Pokud vám nefunguje napsaný kód, postupujte podle tohoto seznamu:

  • Nezapoměli jste načíst samotnou jQuery knihovnu? V hlavičce by mělo být něco jako je toto:
    <script  type="text/javascript" charset="UTF-8" src="/js/jquery-1.4.3.min.js"></script>
  • Je váš napsaný kód pod linkem na jQuery knihovnu?
    <script  type="text/javascript" charset="UTF-8" src="/js/jquery-1.4.3.min.js"></script>
    <script>
    // tady je váš kód
    </script>
  • Čekáte na načtení DOM?
    <script  type="text/javascript" charset="UTF-8" src="/js/jquery-1.4.3.min.js"></script>
    <script>
    $(document).ready(function(){
         // tady je váš kód
    });
    
    // nebo
    $(function(){ 
         // tady je váš kód
    });
    </script>
  • Zkoušeli jste použít chybovou konzoli? Ve většině prohlížečů se spustí klávesovou zkratkou CTRL + ALT + J. Umožňuje seldovat běh vašeho scriptu, nastavovat breakpointy a také zobrazovat různé chyby.
  • Pokud si ani po použití chybové konzole nevíte rady, zeptejte se v diskuzi. Stručně a jasně popište váš problém, přiložte kompletní kód, ideálně i odkaz na webovou stránku a pokud chybová konzole hlásí nějakou chybu, určitě hlášení zkopírujte.