Jquery zeigen oder verbergen ein bestimmtes Element

-2

Hallo, ich versuche, ein bestimmtes Element mit der gleichen ID oder Klasse wie andere zu zeigen/zu verbergen.Jquery zeigen oder verbergen ein bestimmtes Element

Also wenn ich auf den ersten Button klicke id = showimg wird zuerst div angezeigt, aber nicht beide. Irgendwelche Ideen wie soll ich mein Problem lösen?

Quelle

2017-03-09 Jakub Staněk

Nun ist der erste Schritt zur Lösung eines Problems der Versuch, es selbst zu lösen, bevor man um Hilfe bittet. – Santi

Ich weiß, wie div. Aber wie man erstes oder zweites div zeigt? Nicht beide zur gleichen Zeit –

Nun, als ein Schub in die richtige Richtung, müssen Element-IDs * eindeutig *** sein. Aber Sie sollten etwas über '$ (this)' recherchieren, was sich nur auf das angeklickte Element auswirkt. – Santi

Wenn Sie JQuery verwenden, weisen diese jede Taste die gleiche Klasse und versuchen:

$(".whateveryourclass").click(function() { 

    $(this).toggle(); 

});

Quelle

2017-03-09 23:04:55 James

@Santi Guter Punkt - Ich habe die Änderung vorgenommen. Normalerweise stimme ich Ihnen zu, dass es nicht beantwortet werden sollte, außer dass ich nicht weiß, ob das OP es versucht hat oder nicht. Sieht so aus, als ob sein/ihr Englisch nicht das beste ist und sie sind neu bei S/O, also war es eine so einfache Antwort, ich dachte, ich würde helfen. – James

Ich verstehe was du gepostet hast, aber es ist eigentlich nicht was ich suche. Ich brauche etwas wie wenn ich zum Beispiel zuerst #showimg klicke, es wird zuerst div angezeigt und wenn ich auf Sekunde klicke, wird das selbe passieren, aber mit dem zweiten div. Ich hoffe du verstehst mich –

@ JakubStaněk Aber woher weißt du eigentlich, was '' showimg''' zu zeigen? Sie sollten die Architektur der App erraten. Etwas klingt nicht richtig. – James

Stellen Sie sich zwei oder mehr Personen mit der gleichen Sozialversicherungsnummer ... es ein Chaos wäre, wouldn‘ t es ?! Das Gleiche gilt für ID → es muss eindeutig pro Seite sein.

Klassen verwenden. Oder noch besser nutzen data-* wie ein gewünschtes Ziel zu verweisen Attribute:

var $toggle = $("[data-toggle]"); // Collect all buttons 
 
var $togglable = $("[data-togglable]"); // Collect all containers 
 
var btnText = ["↑ Skrýt přílohu","↓ Zobrazit přílohu"]; 
 

 

 
$toggle.on("click", function(){ // The toggle buttons... 
 

 
    // Get my data value 
 
    var data = this.dataset.toggle; 
 
    // I should target the container which data value matches mine 
 
    var $target = $("[data-togglable='"+ data +"']"); 
 
    // Now let's handle the buttons texts: 
 
    // Show the opening text to all buttons (I'll handle my-self soon) 
 
    $toggle.not(this).text(btnText[1]); 
 
    // Toggle my text 
 
    $("[data-toggle='"+ data +"']").text(btnText[+$target.is(":visible")]); 
 
    
 

 
    // Hide all opened containers (ignore my target container, I'll handle him soon) 
 
    $togglable.not($target).stop().slideUp(); 
 
    // Toggle my target container 
 
    $target.stop().slideToggle(); 
 
    
 
});

/* BUTTONS */ 
 
a[data-toggle] { 
 
    border-top: 1px solid #444; 
 
    display: block; 
 
    padding: 8px 16px; 
 
    background: #0bf; 
 
    color: #fff; 
 
    cursor: pointer; 
 
} 
 

 
a[data-toggle] .hideimg{ 
 
    display: none; /* hide "Skrýt přílohu" initially */ 
 
} 
 

 
/* CONTENTS */ 
 
.images-con{ 
 
    display:none; /* hide all DIVs initially */ 
 
    padding: 8px 16px; 
 
    background: #bf0 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<a data-toggle="div1">&darr; Zobrazit přílohu</a> 
 
<div data-togglable="div1" class="images-con">Hi! I'm div1</div> 
 

 

 
<a data-toggle="div2">&darr; Zobrazit přílohu</a> 
 
<div data-togglable="div2" class="images-con">Hello♪ It's me...</div>

Quelle

2017-03-10 00:38:21

So endlich ich es gemacht. Ich habe showimg/hideimg von ID zu Klasse geändert. Das hat mein Problem gelöst.

$(".showimg").click(function(){ 
    $(this).parents(".images-gallery").find("div.images-con").show() 
    $(this).parents(".images-gallery").find(".hideimg").show() 
    $(this).parents(".images-gallery").find(".showimg").hide() 
}); 

$(".hideimg").click(function(){ 
    $(this).parents(".images-gallery").find("div.images-con").hide() 
    $(this).parents(".images-gallery").find(".showimg").show() 
    $(this).parents(".images-gallery").find(".hideimg").hide() 
});

Quelle

2017-03-11 00:12:11

Wo befindet sich 'images-gallery' in Ihrem bereitgestellten Fragecode? –

Jquery zeigen oder verbergen ein bestimmtes Element

Antwort

Verwandte Themen