Wie kann ich den Text eines Kindes DIV in einem Repeater eingestellt?

Question

Ich habe einen Repeater folgenden HTML Code enthalten:

<div id='parent'>
    <div id='child1'/>
    <div id='child2'>
         <script type="text/javascript" src="script.js"></script>
    </div>
</div>

Ich möchte das div wählen „Eltern“ markiert eine Funktion innerhalb script.js und stellen Sie den inneren HTML-Code der div mit id „child1“ verwendet wird.

Meine letzte html sollte wie folgt aussehen:

<div id='parent'>
    <div id='child1'>This inner text was set by jQuery</div>
    <div id='child2'>
        <script type="text/javascript" src="script.js"></script>
    </div>
</div>

Wie mache ich es mit jQuery?

Answer 1

Sie können zunächst nicht codieren Ihre HTML diese Art und Weise in einem Repeater. Sie können nicht die gleichen IDs, um mehrere Elemente auf der Seite zuweisen. Ihre HTML müssen Klassen für die Identifizierung verwenden, wenn man sie überhaupt identifizieren.

<div class="parent">
  <div class="child1"><div>
  <div class="child2">Click Me<div>
</div>

Funktionen im Skript-Tag haben keine Möglichkeit zu wissen, wo sie sonst alles in dem DOM relativ sind. Sie werden den Funktionsaufruf an ein Element, um binden müssen in der Lage sein, die relativen DOM Beziehungen zu ihnen zu ziehen. Der einfachste Weg ist jQuery (oder einem anderen Rahmen) zu verwenden, um einige Handler auf die Elemente hinzuzufügen.

$(function() {
    $('.child2').click( function() {
        $(this).parent().find('.child1').html( 'some html' );
    });
});

Das oben einen Click-Handler für jede DIV mit Klasse child2 hinzufügen und wenn es angeklickt wird, wird es übergeordnete DIV (beachten Sie, dass die Klasse auf dem übergeordneten nicht erforderlich ist) und dann das richtige Kind HTML deren zur Aktualisierung auf der Grundlage ihres Klasse. Beachten Sie auch, dass das obige Skript muss nur einmal auf der Seite hinzugefügt werden, nicht einmal pro Repeater Element.

Answer 2

$('#parent').children('#child1').html('html goes here');

Answer 3

Ihre Frage nicht viel Sinn machen. Sie können dies nur tun:

$("#child1").html("blah");

Sie brauchen nicht einen Verweis oder #parent this.

Aber angenommen, das war nicht der Fall ist, gibt es mehr Möglichkeiten, wie Sie ein Element relativ zu this finden:

$(this).children("#child1")

oder

$(this).find("#child1") // descendant, not just child

oder

$("#child1", this) // descendant, not just child