Zwei gleiche Widget mit Jquery

Question

Ich bin neu auf JQuery, aber ich frage mich, ob mir jemand über das Problem helfen:

Betrachten Sie 2 Textbox mit Datumsauswahl in einer HTML-Seite mit jQuery UI haben müssen. Wie ich weiß, Jquery basiert auf "ID" und nicht "Klasse". so kann ich nicht verwenden:

<input type="text" name="dates2" class="datepicker"> --> DOESN'T WORK! 
<input type="text" name="dates3" class="datepicker"> --> DOESN'T WORK! 

Wie auch immer, wenn ich ID verwenden möchten, nur die erste Datepicker Textbox funktioniert. wie der gleiche:

<input type="text" name="dates2" id="datepicker"> -> WORKS! 
<input type="text" name="dates2" id="datepicker"> -> DOESN'T WORK! 

Seine offensichtlich jede ID sollte eindeutig sein. aber meine Frage ist so primitiv, aber gibt es irgendeine Möglichkeit, zwei Datepicker (oder Slider oder ein anderes Widget) hier zu haben? Wenn die Antwort Ja ist, also bitte hilf mir, wie kann ich es mit JQueryUI tun?

Danke.

Answer 1

Id soll einzigartig sein. Der Jquery-ID-Selektor wird das erste Element basierend auf den Kriterien erhalten, weshalb das zweite Element nicht betroffen ist. Ich kann vorschlagen, Klasse auf die Elemente anzuwenden.

<input type="text" name="dates2" class="datepicker"> 
<input type="text" name="dates3" class="datepicker"> 

Und dann Klassenselektor in jquery statt ID-Selektor verwenden.

<script> 
    $(function() { 
     $(".datepicker").datepicker(); // class selector 
    }); 
</script>