Ich versuche, Bilder ohne src in WordPress auszublenden.
Es folgt der Bildcode, der auf dem Frontend angezeigt wird
<img src="https://stackoverflow.com/questions/50340670/[custom-gallery-image-01]" class="galimage" height="300" width="580"/>
JS verwendet, um das Bild zu verbergen
<script type="text/javascript">
$(document).ready(function() {
$(".galimage").each(function() {
var atr = $(this).attr("src");
if(atr == "") {
$(this).addClass("hidegalimage");
} else {
$(this).removeClass("hidegalimage");
}
});
});
</script>
CSS
.hidegalimage {
display:none;
}
Aber ich kann immer noch das kaputte Bildsymbol und einen Bildrand sehen. Aussicht JSFiddle. Kann jemand mein Problem beheben oder mir einen Vorschlag machen, wie ich das Bild ausblenden kann?
Danke vielmals
Viel eleganter, stattdessen CSS zu verwenden, kein Javascript erforderlich, das Schlechte vorausgesetzt srcs beginnen mit [ as in your HTML: are empty strings:
.galimage[src=""] { Anzeige: keine; }
<img src="https://www.gravatar.com/avatar/b3559198b8028bd3d8e82c00d16d2e10?s=32&d=identicon&r=PG&f=1" class="galimage" height="300" width="580"/>
<img src="" class="galimage" height="300" width="580"/>
<img src="https://www.gravatar.com/avatar/b3559198b8028bd3d8e82c00d16d2e10?s=32&d=identicon&r=PG&f=1" class="galimage" height="300" width="580"/>
Verwendung von jquery
$("img").error(function(){
$(this).hide();
});
Oder
$("img").error(function (){
$(this).hide();
// or $(this).css({'display','none'});
});
- keine CSS-Alternative erforderlich
Sie können dies verwenden, aber dies verbirgt nicht das Entfernen von der Seite (DOM):
<img id='any' src="https://invalid.com" onerror="document.getElementById(this.id).remove()" >
disply:none;Rechtschreibung ist beim Programmieren wichtig.– Bestimmte Leistung
15. Mai 2018 um 0:16 Uhr
Mein Fehler, ich habe es in JSFiddle behoben, aber es zeigt immer noch das kaputte Bild
– Anna Wellington
15. Mai 2018 um 0:17 Uhr
Angenommen die
[custom-gallery-image-01]Shortcode wird durch eine leere Zeichenfolge ersetzt, wenn kein Bild gefunden wird, dann funktioniert Ihr Code: jsfiddle.net/ukc78mrm– Cabrerahektor
15. Mai 2018 um 0:25 Uhr
In Ihrem Code suchen Sie nach, ob src einer leeren Zeichenfolge entspricht. Aber in Ihrem Bild-Tag ist Ihre Zeichenfolge auf eine wörtliche Zeichenfolge von festgelegt [custom-gallery-image-01]. Wenn die Funktion ausgeführt wird, wird Ihre Klasse nicht festgelegt, da src nicht leer ist.
– bnjmn.myers
15. Mai 2018 um 0:25 Uhr
@cabrerahector Danke!
– Anna Wellington
15. Mai 2018 um 3:30 Uhr