2016-11-09 2 views
-1

Ich gehe durch jQuery Tutorial auf WS3School. Ich verstehe, wie es funktioniert, aber ich kann nicht auf die Art und Weise denken, wie es verwendet werden kann.jQuery Grundlagen (Theorie) - Was kann ich mit Index (i) -Parameter in .text (i, x), .html (i, x) oder .val (i, x) tun?

Beispiel von Website unten oder here.

$(document).ready(function(){ 
 
    $("#btn1").click(function(){ 
 
     $("#test1").text(function(i, origText){ 
 
      return "Old text: " + origText + " New text: Hello world! (index: " + i + ")"; 
 
     }); 
 
    }); 
 

 
    $("#btn2").click(function(){ 
 
     $("#test2").html(function(i, origText){ 
 
      return "Old html: " + origText + " New html: Hello <b>world!</b> (index: " + i + ")"; 
 
     }); 
 
    }); 
 
});
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
</head> 
 
<body> 
 

 
<p id="test1">This is a <b>bold</b> paragraph.</p> 
 
<p id="test2">This is another <b>bold</b> paragraph.</p> 
 

 
<button id="btn1">Show Old/New Text</button> 
 
<button id="btn2">Show Old/New HTML</button> 
 

 
</body> 
 
</html>

Jeder könnte ein Beispiel geben? Code geschätzt, aber nicht notwendig.

+1

Es gibt viele Möglichkeiten, wie Sie für einen Index verwenden möchten. Zum Beispiel, wenn Sie eine Eins-zu-eins-Entsprechung zwischen einem Element zu einem anderen wollen, das nur durch ihren Index (d. H. Ihre Position) in Beziehung steht. Möglicherweise möchten Sie die Anzahl der Iterationen beim Durchlaufen einer Sammlung begrenzen. Vielleicht möchten Sie ungerade/gerade/jedes * n * -te Kind in Ihrer Sammlung auswählen. Und so weiter und so fort. Ich stimme zu schließen, weil es nur zu einer meinungsbasierten Antwort ermutigt. – Terry

+0

Sie müssen wirklich lesen, Jquery, durch eines der Online-Tutorial. Diese Plattform ist nicht für Tutorials gedacht. Wenn Sie während der Entwicklung stecken geblieben sind, sind wir für Sie da. – Samir

+1

es muss nicht jedes Mal verwendet werden. Es ist ein Iterator. Nehmen wir an, Sie möchten jedes zweite Element ('i% 2 == 0') oder so etwas hervorheben. Es gibt viele Möglichkeiten. In diesem Fall ist "i" nutzlos, da Sie nur ein Element haben. –

Antwort

2

sollte dies praktische Bedeutung, die ihm helfen, bringen:

var trial = 0; 
 
function indexTrial(i, prevText) { 
 
    //console.log(i + ': ' + prevText + ' (trial: ' + trial + ')'); 
 
    return prevText + ', (got <u>index ' + i + '</u> on trial ' + trial + ')'; 
 
} 
 

 
trial++; 
 
$('li').html(indexTrial); 
 

 
trial++; 
 
$('#second-list li').html(indexTrial); 
 

 
trial++; 
 
$('#second-list li:even').html(indexTrial);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<ul id="first-list"> 
 
    <li>abc</li> 
 
    <li>def</li> 
 
    <li>ghi</li> 
 
    <li>jkl</li> 
 
</ul> 
 
<hr/> 
 
<ul id="second-list"> 
 
    <li>123</li> 
 
    <li>456</li> 
 
    <li>789</li> 
 
</ul>

1

Möglicherweise müssen Sie es in einem Fall wie diesem verwenden:

$("ul li").text(function(index) { 
    return "item number " + (index + 1); 
}); 

Was bedeutet .text(index) nützlich sein könnten, wenn Sie es in Arrays verwenden.

Verwandte Themen