Hier ist mein Code:JQuery: ausblenden() und Show() Elemente nach ihnen mit Last zu erzeugen()
$(".feat").click(function() {
$('#content').empty();
$('#content').load('loaded/features.html', function() {
$('.expla').hide();
$('.g1,.g2,.g3,.g4,.g5,.g6').hide();
$('.f1,.f2,.f3,.f4,.f5,.f6').hide();
$('.w1,.w2,.w3,.w4,.w5,.w6').hide();
});
Hier features.html ist, aber es ist nicht relevant:
<div id="eruscont">
<div id="erustyle">What I can do !</div>
<div id="undercore">
<div id="grinder">
<div class="title grinder plus"><p>Grinder <img src="image/add.png" /></p></div>
</div>
<div id="flyer">
<div class="title flyer plus"><p>Flyer <img src="image/add.png" /></p></div>
</div>
<div id="whack">
<div class="title whack plus"><p>WHack <img src="image/add.png" /></p></div>
</div>
</div><!-- Fin undercore -->
</div><!-- Fin eruscont -->
<div id="schema"><div id="mainstuff"><p>Browse my main options, and you'll see what I'm able to do for you !</div>
<div class="expla egrinder">
<div class="explication g1">Define a path and kill mobs</div>
<div class="explication g2">Smart movement/path system</div>
<div class="explication g3">Loots, skins, gathers using ground mount</div>
<div class="explication g4">Sells, buys, repairs, mails stuff</div>
<div class="explication g5">Automatic spell casting highly customizable</div>
<div class="explication g6">Computer still available for use when running</div>
</div>
<div class="expla eflyer">
<div class="explication f1">Define a path and gather resources</div>
<div class="explication f2">Kills, loots, skins, mines, Herbs</div>
<div class="explication f3">Uses flying mount and Swiming mount</div>
<div class="explication f4">Sells, buys, repairs, mails stuff</div>
<div class="explication f5">Analyzes your skill level and pick up what you can have</div>
<div class="explication f6">Computer still available for use when running</div>
</div>
<div class="expla ewhack">
<div class="explication w1">Use your character differently</div>
<div class="explication w2">Fly hack, Water Walk, Wall walk</div>
<div class="explication w3">Removes collision, AFK, falling and Lua protection</div>
<div class="explication w4">Auto Loot, Auto kick, tracking and morpher</div>
</div>
</div>
. Erklärung .g1 ...., f1 ..., w1 ... sind Elemente in features.html. Aber sie sind nicht versteckt durch die hide() Methode, außerdem später in meinem Code benutze ich show() Methode, um diese Elemente dank verschiedener Ereignisse erscheinen zu lassen.
Ich schätze das Problem liegt daran, dass das Ergebnis von load() nicht zum DOM hinzugefügt wird. Aber ich weiß nicht, wie ich es schaffen soll. Ich bin nicht so gut mit jQuery.
könnten Sie mir helfen?
Danke fürs Lesen!
EDIT: Ich lag falsch, der Versteckeffekt funktioniert, ich zielte nur auf die falschen Elemente. Aber danach geladene Elemente meine ich zum Beispiel nicht verwendbar sind dies nicht funktioniert:
if($('.expla.eflyer').is(':visible') || $('.expla.ewhack').is(':visible'))
{
$('.expla').hide();
$('#mainstuff').hide();
$('.flyer img').attr({src: "image/add.png" });
$('.whack img').attr({src: "image/add.png" });
$('.flyer','.whack').addClass('plus');
$('.g1,.g2,.g3,.g4,.g5,.g6').hide();
$('.w1,.w2,.w3,.w4,.w5,.w6').hide();
$('.grinder').removeClass('plus');
$('.f1,.f2,.f3,.f4,.f5,.f6').hide();
$('.expla.egrinder').show("blind", { direction: "vertical" }, 3000,function() { callback("g")});
$('.grinder img').attr({src: "image/minus.png" });
return false;
}
Dieser Code wird in einer anderen js Datei befindet, die aufgrund der fehlenden Optimierung ein echtes großes Durcheinander, aber die richtig funktionieren, hier ist die gesamte Seite, wenn Sie sehen möchten, wie kompliziert es ist:
$(document).ready(function()
{
$('.expla').hide();
$('.g1,.g2,.g3,.g4,.g5,.g6').hide();
$('.f1,.f2,.f3,.f4,.f5,.f6').hide();
$('.w1,.w2,.w3,.w4,.w5,.w6').hide();
// run the currently selected effect
$(".grinder img").click(function() {
if($('.grinder').hasClass('plus'))
{
if($('.expla.eflyer').is(':visible') || $('.expla.ewhack').is(':visible'))
{
$('.expla').hide();
$('#mainstuff').hide();
$('.flyer img').attr({src: "image/add.png" });
$('.whack img').attr({src: "image/add.png" });
$('.flyer','.whack').addClass('plus');
$('.g1,.g2,.g3,.g4,.g5,.g6').hide();
$('.w1,.w2,.w3,.w4,.w5,.w6').hide();
$('.grinder').removeClass('plus');
$('.f1,.f2,.f3,.f4,.f5,.f6').hide();
$('.expla.egrinder').show("blind", { direction: "vertical" }, 3000,function() { callback("g")});
$('.grinder img').attr({src: "image/minus.png" });
return false;
}
else
{
$('#mainstuff').hide();
$('.g1,.g2,.g3,.g4,.g5,.g6').hide();
$('.grinder').removeClass('plus');
$('.expla.egrinder').show("blind", { direction: "vertical" }, 3000,function() { callback("g")});
$('.grinder img').attr({src: "image/minus.png" });
return false;
}
}
else
{
$('.grinder img').attr({src: "image/add.png" });
$('.g1,.g2,.g3,.g4,.g5,.g6').hide();
$('.expla.egrinder').hide("explode", 1500);
$('.grinder').addClass('plus');
return false;
}
});
$(".flyer img").click(function() {
if($('.flyer').hasClass('plus'))
{
if($('.expla.egrinder').is(':visible') || $('.expla.ewhack').is(':visible'))
{
$('.expla').hide();
$('#mainstuff').hide();
$('.grinder img').attr({src: "image/add.png" });
$('.whack img').attr({src: "image/add.png" });
$('.grinder','.whack').addClass('plus');
$('.g1,.g2,.g3,.g4,.g5,.g6').hide();
$('.w1,.w2,.w3,.w4,.w5,.w6').hide();
$('.flyer').removeClass('plus');
$('.f1,.f2,.f3,.f4,.f5,.f6').hide();
$('.expla.eflyer').show("blind", { direction: "vertical" }, 3000,function() { callback("f")});
$('.flyer img').attr({src: "image/minus.png" });
return false;
}
else
{
$('#mainstuff').hide();
$('.f1,.f2,.f3,.f4,.f5,.f6').hide();
$('.flyer').removeClass('plus');
$('.expla.eflyer').show("blind", { direction: "vertical" }, 3000,function() { callback("f")});
$('.flyer img').attr({src: "image/minus.png" });
return false;
}
}
else
{
$('.flyer img').attr({src: "image/add.png" });
$('.expla.eflyer').hide("explode", 1500);
$('.f1,.f2,.f3,.f4,.f5,.f6').hide();
$('.flyer').addClass('plus');
return false;
}
});
$(".whack img").click(function() {
if($('.whack').hasClass('plus'))
{
if($('.expla.egrinder').is(':visible') || $('.expla.eflyer').is(':visible'))
{
$('.expla').hide();
$('#mainstuff').hide();
$('.grinder img').attr({src: "image/add.png" });
$('.flyer img').attr({src: "image/add.png" });
$('.grinder','.flyer').addClass('plus');
$('.g1,.g2,.g3,.g4,.g5,.g6').hide();
$('.w1,.w2,.w3,.w4').hide();
$('.whack').removeClass('plus');
$('.f1,.f2,.f3,.f4,.f5,.f6').hide();
$('.expla.ewhack').show("blind", { direction: "vertical" }, 3000,function() { callback("w")});
$('.whack img').attr({src: "image/minus.png" });
return false;
}
else
{
$('#mainstuff').hide();
$('.w1,.w2,.w3,.w4').hide();
$('.whack').removeClass('plus');
$('.expla.ewhack').show("blind", { direction: "vertical" }, 3000,function() { callback("w")});
$('.whack img').attr({src: "image/minus.png" });
return false;
}
}
else
{
$('.whack img').attr({src: "image/add.png" });
$('.expla.ewhack').hide("explode", 1500);
$('.w1,.w2,.w3,.w4').hide();
$('.whack').addClass('plus');
return false;
}
});
// Grinder callbacks
// Flyer callbacks
//WHack callbacks
function callback(xlol) {
var pif = "."+xlol+"1";
var arg = xlol;
$(pif).show("slide", 200, function() { call2(arg)});
};
function call2(xlol) {
var pif = "."+xlol+"2";
var arg = xlol;
$(pif).show("slide", 200,function() { call3(arg)});
};
function call3(xlol) {
var pif = "."+xlol+"3";
var arg = xlol;
$(pif).show("slide", 200,function() { call4(arg)});
};
function call4(xlol) {
var pif = "."+xlol+"4";
var arg = xlol;
$(pif).show("slide", 200,function() { call5(arg)});
};
function call5(xlol) {
var pif = "."+xlol+"5";
var arg = xlol;
$(pif).show("slide", 200,function() { call6(arg)});
};
function call6(xlol) {
var pif = "."+xlol+"6";
$(pif).show("slide", 200);
};
});
Nein, es funktioniert nicht, hatte ich versucht, diese Lösung bereits ^^ Dank für Sie :-) –