Fórum Root.cz
Hlavní témata => Vývoj => Téma založeno: Petr 08. 12. 2017, 17:34:03
-
Ahoj,
poradili by jste jak tohle napsat líp? Nehci psát ke každému odkazu funkci s parametrem.
<a href="#" onclick="myFunction(0)">A</a>
<a href="#" onclick="myFunction(1)">B</a>
<a href="#" onclick="myFunction(2)">C</a>
<div id="result"></div>
<script>
function myFunction(fn){
$("#result").load(fn+".html");
}
</script>
Potřeboval bych to nějak takto ale nevím co dát místo ? ? ? ? ? ? ? ? ?.
<a href="#">A</a>
<a href="#">B</a>
<a href="#">C</a>
<div id="result"></div>
<script>
$("#result").on("click", function() {
$("#result").load(? ? ? ? ? ? ? ? ? + ".html");
});
</script>
Děkuji za pomoc.
-
<a href="#">A</a>
<a href="#">B</a>
<a href="#">C</a>
<div id="result"></div>
<script>
$("a").on("click", function(e) {
var i = $("a").index(e.target);
$("#result").load(num + ".html");
});
</script>
-
oprava
<a href="#">A</a>
<a href="#">B</a>
<a href="#">C</a>
<div id="result"></div>
<script>
$("a").on("click", function(e) {
var i = $("a").index(e.target);
$("#result").load(i + ".html");
});
</script>
-
Moc děkuji za pomoc. A to se vztahuje na všechny tágy <a> na celé stránce? Pokud ano, šlo by to omezit třeba na konkrétní div? Aby to nehledal jinde na stránce? Děkuji
<div id="menu">
<a href="#">A[/url]
<a href="#">B[/url]
<a href="#">C[/url]
</div>
-
funguje to s libovolným selektorem.
<script>
$("#menu a").on("click", function(e) {
var i = $("#menu a").index(e.target);
$("#result").load(i + ".html");
});
</script>
-
Funguje to parádně. moc děkuji!
Jen pro zajímavost, pokud použiji jako wrapper html tág bez ID nebo CLASS v tomto případě <navi>, bude celý zápis takto správně?
<navi>
<a href="#">A[/url]
<a href="#">B[/url]
<a href="#">C[/url]
</navi>
<script>
$("navi a").on("click", function(e) {
var i = $("#menu a").index(e.target);
$("#result").load(i + ".html");
});
</script>
-
Oprava:
<nav> ne <navi> ;)
-
jo to bude fungovat. Libovolny CSS selektor, ktery vyselektuje ty odkazy bude fungovat.
-
ale musite ho zmenit i v tom druhem vyskytu.
<nav>
<a href="#">A[/url]
<a href="#">B[/url]
<a href="#">C[/url]
</nav>
<script>
$("nav a").on("click", function(e) {
var i = $("nav a").index(e.target);
$("#result").load(i + ".html");
});
</script>
-
Jasně, proto mi to nefungovalo ;-) Děkuji
Teď když to tak zkouším, tak to asi nebude vhodné řešení :( Nějak jsem si neuvědomil, že když přidám další odkaz mezi třeba A a B tak se čísla změní směrem dolů u všech položek a názvy souborů nebudou sedět k danému odkazu. Neexistuje ještě nějaká možnost jak to jednoduše ošetřit?
-
Ztráta času. Snad poradí někdo jiný.
-
<a href="a.html">A</a>
<a href="b.html">B</a>
<a href="c.html">C</a>
<div id="result"></div>
<script>
$("a").on("click", function() {
$("#result").load(this.href);
});
</script>
Když máš víc odkazů, tak je musíš nějak rozlišit. Když je budeš rozlišovat indexem, tak se nediv, že se ti to bude rozbíjet po přidání odkazu na začátek.
Zkus si s tím hrát sám. `console.log()` je tvůj kamarád.