2017-10-21 1 views
0

Ich habe 2 .tablerow mit derselben Taste Klasse:Wie Text für den nächsten div ändern

<div class="tablerow> 
    <div><button class="clickhere">Button 1</button><div> 
    <div><span></span><div> 
</div> 
<div class="tablerow> 
    <div><button class="clickhere">Button 2</button><div> 
    <div><span></span><div> 
</div> 

Jedes Mal, wenn ich auf der .clickhere Schaltfläche geklickt ich einen Text angezeigt werden soll, die dynamisch auf den vorherigen klickten basierend ändern Taste.

Zum Beispiel: Let sagen, dass ich auf dem Knopf klicken 2, dann will ich nur in den <span></span> der gleichen .tablerow einen Text zeigen, die in der ersten Zeile angezeigt nicht werden sollen.

Meine Frage ist, wie Sie feststellen können, auf welche Schaltfläche geklickt wurde, und ändern Sie den Text der Spannweite neben der angeklickten Schaltfläche?

Antwort

0

Blick in diese

$(".clickhere").click(function() { 
    $(this).parents(".tablerow").find("span").text("whatever"); 
}); 

Sie das übergeordnete .tablerow des angeklickten Objekt auswählen, und den Text der Spanne ändern innerhalb es

Auch Ihre HTML-Struktur und Syntax etwas falsch ist, muss es sein

<div class="tablerow"> 
    <div><button class="clickhere">Button 1</button></div> 
    <div><span></span></div> 
</div> 
<div class="tablerow"> 
    <div><button class="clickhere">Button 2</button><div> 
    <div><span></span></div> 
</div> 
+1

Könnte nett sein zu sagen, wie der HTML-Code falsch ist. –

0
$(this).parent().next('div').find('span').text('super cool text'); 
0

Das erste, was - Sie benötigen, um Ihre c zu beheben verlieren div-Tags in Ihrem TableRow divs:

<div class="tablerow> 
    <div><button class="clickhere">Button 1</button></div> 
    <div><span></span></div> 
</div> 
<div class="tablerow> 
    <div><button class="clickhere">Button 2</button></div> 
    <div><span></span></div> 
</div> 

Second - für den Javascript können Sie versuchen:

$(".clickhere").click(function(){ 
    $(this).siblings('div span').empty().append("New text"); 
}); 

Dadurch werden die Inhalte zu entfernen, die zuvor in der Spanne war - und fügen Sie den neuen Text ein.

Verwandte Themen