Elemente in iframe ausblenden

Question

Ich habe einen iframe (gleiche Domäne) und ich verstecke einige Elemente, die ich nicht von diesem iframe anzeigen möchte. Alles funktioniert, aber wenn ich auf eine ul> li-Liste klicke und ich ein Element dieser Liste auswähle, werden die versteckten Elemente wieder angezeigt.

Der iFrame ändert nicht die ID der ausgeblendeten Elemente oder etwas ähnliches, daher weiß ich nicht, warum die ausgeblendeten Elemente wieder angezeigt werden.

Die Lösung, die ich gerade habe, ist ein setInterval, das die Elemente verborgen hält, aber es kollabiert die Seite nach einigen Minuten inaktiv auf der Seite, so dass ich eine andere Lösung brauche.

Ich habe versucht, etwas wie eine Klick-Funktion innerhalb des Iframe zu erkennen, aber wenn ich ein Element der Liste wählen, funktioniert diese Funktion nicht mehr.

$(function(){ 
     var f=$('#iframe') 
     f.load(function(){ 
      f.contents().find("#____bl_k_dd").on('click', function(event) { 
       runAfterTimeout(); 
      }); 
     }); 
    }); 
    function runAfterTimeout() { 
     setTimeout(function(){ 
      alert("hi its me"); 
      $('#iframe').contents().find('body').css("background", "green"); 
     },2000); 
    }; 

Ich versuche eine Klick-Funktion auf das Element zu erkennen, es funktioniert das erste Mal, dann funktioniert es nicht.

Wenn ich die ID des Elements in Körper ändern, funktioniert es nur manchmal, also ist es keine Lösung.

Answer 1

Sie können eine CSS-Datei erstellen und fügen Sie es Ihrer iframe Seite

var $head = $("iframe").contents().find("head");     
$head.append($("<link/>", 
    { rel: "stylesheet", href: "file://path/to/style.css", type: "text/css" }));