Javascript .wrap f-ja

Sveiki, noriu kiekvienam <li> elementui pridėti tam tikrą html kodą, iš to ką dabar turiu viskas būtų gerai, bet elementas atsiduria nevisai toje vietoje kurioje turėtų.

PHP/HTML kodas:

<div id="bx-pager">
<ul>
<?php $slider_title = new WP_Query('post_type=slaider&posts_per_page=5'); 
while($slider_title->have_posts()) : $slider_title->the_post(); ?>
<li><?php the_title(); ?><span></span></li>
<?php endwhile; ?>
<?php wp_reset_postdata(); // reset the query ?>
</ul>
</div>

JS kodas:

nr = 0;
$("#bx-pager li").each(function() {
$(this).wrap('<a data-slide-index="' + nr + '" href="">');
nr++;
});

Dabar gaunu tokį rezultatą:

<ul>
<a class="active" href="" data-slide-index="0">
<li>Pavadinimas<span></span></li>
</a>
<a href="" data-slide-index="1">
<li>Pavadinimas<span></span></li>
</a>
<a href="" data-slide-index="2">
<li>Pavadinimas<span></span></li>
</a>
<a href="" data-slide-index="3">
<li>Pavadinimas<span></span></li>
</a>
</ul>

O turėtų būti:

<ul>
<li>
<a class="active" href="" data-slide-index="0">
Pavadinimas<span></span></a>
</li>
<li>
<a href="" data-slide-index="1">
Pavadinimas<span></span></a>
</li>
<li>
<a href="" data-slide-index="2">
Pavadinimas<span></span></a>
</li>
<li>
<a href="" data-slide-index="3">
Pavadinimas<span></span></a>
</li>
</ul>

Gal kas kokių įdėjų turi? :)

o kam naudoti wrap? naudoji "html" ir spakaina, tau įmes.

o kam naudoti wrap? naudoji "html" ir spakaina, tau įmes.

Taip, bet kiekvienam <li> reikia numeravimo ant <a> data-slide-index="0", data-slide-index="1", data-slide-index="2" ir t.t.

$("#bx-pager li").each(function(nr) {
$(this).prepend('<a data-slide-index="' + nr + '" href="">');
});

problem?

arba išvis, jam tau kokius append naudoti, kali html ir ramu, viską surašai į ten ir tiek... <a><span></span></a>

$("#bx-pager li").each(function(nr) {
$(this).prepend('<a data-slide-index="' + nr + '" href="">');
});

 

problem?

Dabar:

<li>
<a href="" data-slide-index="0"></a>
Pavadinimas
<span></span>
</li>

Turėtų būt:

<li>
<a href="" data-slide-index="0"></a>
<span>Pavadinimas</span>
</li>

ai, nu tai tu klaidingai parašei pirmą pranešimą... ir kam tu nededi to "pavadinimas" iškart į span'ą? o.O įdedi į jį ir tada rašai:

jQuery("selector").find('li').each(function(count){
var content = jQuery(this).text(); // berods taip išgauni turinį
jQuery(this).html('<a data-slide-index="' + count + '" href="">'+ content + '</a>);
});

done..

ai, nu tai tu klaidingai parašei pirmą pranešimą... ir kam tu nededi to "pavadinimas" iškart į span'ą? o.O įdedi į jį ir tada rašai:

 

jQuery("selector").find('li').each(function(count){
var content = jQuery(this).text(); // berods taip išgauni turinį
jQuery(this).html('<a data-slide-index="' + count + '" href="">'+ content + '</a>);
});

 

done..

Turbūt čia karštis per galvą duoda :D Pirmas pranešimas teisingas, čia kur rašiau, kad <span>Pavadinimas</span> - tai neteisingai parašiau, turi būt Pavadinimas<span></span>

Dabar

nr = 0;
$("#bx-pager li").each(function() {
$(this).prepend('<a data-slide-index="' + nr + '" href=""><span></span></a>');
nr++;
});

Išveda:

<ul>
<li><a href="" data-slide-index="1"><span></span></a>Pavadinimas</li>
</ul>

Turėtų būt:

<ul>
<li><a href="" data-slide-index="1">Pavadinimas<span></span></a></li>
</ul>

Tą <?php the_title(); ?> kažkaip reiktų įdėti į javascript kodą.

Siūlyčiau grįžti prie braižymo lentos, nes ką tu čia darai, yra išsigimimas.

Siūlyčiau grįžti prie braižymo lentos, nes ką tu čia darai, yra išsigimimas.

Dėja mes čia ne braižymo būrelio darbais užsiemam, jei neturi ką pasakyt, geriau patylėk.

man išvis keista, kaip tu čia darai. kam tą išvis jquery naudoti? gi tu gali viską sukelti taip ar taip iškarto į dom'ą kai suki ciklą, taip tik be reikalo apkrauni puslapį :)

man išvis keista, kaip tu čia darai. kam tą išvis jquery naudoti? gi tu gali viską sukelti taip ar taip iškarto į dom'ą kai suki ciklą, taip tik be reikalo apkrauni puslapį :)

Tiesa. Be vargo galima WP loop'e viską įgyvendinti. Būtų gerai sužinoti kur nauda tai darant su JS.

http://jsfiddle.net/EK7uc/

Dėkui, super tai ko reikėjo. :)

Tiesa. Be vargo galima WP loop'e viską įgyvendinti. Būtų gerai sužinoti kur nauda tai darant su JS.

Pasirinkau daryti su JS, kadangi kiekvienam <a> elementui reikia skaičiuoti data-slide-index numerį. Visada yra geresnių būdų, tiesiog šitas pirmas šovė į galvą.

wut? o tai nemoki countinimo įsukti į while? ir geriausias, tikrai geriausias būdas būtų tai atlikti while loope..

$count = 0;
while(...) $count++; print('<a data-slide='. $count .'....');