Forum Mjukvara Programmering och digitalt skapande Tråd

Problem med javascript - gärna snabb hjälp!

1
Skriv svar
Permalänk
Medlem ★
●

Problem med javascript - gärna snabb hjälp!

Tja!
De är så att jag har ett problem med jQuery som jag fasiken inte lyckas lösa..

Så här är det.
Jag har följt den här tutorialen http://yensdesign.com/2008/12/how-to-load-content-via-ajax-in... med att få innehåll från ett annan dokument att ladda in till en existerande sida.

Ska nämligen ha det till en portfolio sida där innehållet ska laddas till samma sida, lite av ett galleri kan man säga.

Det funkar väldigt bra med javascripten ända tills jag lägger in den i min egna scriptfil, då fungerar inte scripten nå mer, och jag vet inte hur jag ska lösa det..
Scripten "krockar" eller något med de existerande scriptsens i filen.
Har även provat göra en egen scriptfil till laddningsscripten, men med samma resultat.

Här är scripten som laddar innehållet till sidan, eller in i en div om man så vill.

//References  
	var sections = $("#menu li");  
	var loading = $("#loading");  
	var content = $("#innehall");
	
	function showLoading(){  
		loading  
		.css({visibility:"visible"})  
		.css({opacity:"1"})  
		.css({display:"block"});  
	}  
	
		//hide loading bar  
		function hideLoading(){  
			loading.fadeTo(1000, 0);  
			content.slideDown();  
		};

	sections.click(function(){  
		//show the loading bar  
		showLoading();  
		
		//load selected section  
			switch(this.id){  
				case "home":  
				content.slideUp();  
				content.load("sections.html #section_home", hideLoading);  
				break;
					
					case "news":  
					content.slideUp();  
					content.load("sections.html #section_news", hideLoading);  
					break;
					
						default:  
						//hide loading bar if there is no selected section  
						hideLoading();  
						break;  
			}  
	});

och här finns hela javascripten http://xions.freehostia.com/problem/custom.js

Är det någon som vet hur jag löser det här?

Lite dåligt förklarat kanske, inte så bra på att förklara
Om något är oklart så försöker jag förklara lite bättre

Senast redigerat
Visa signatur

Flickr

Redigera
Citera flera Citera
Permalänk
Medlem
●

Du vill alltså att andra webbdesigners/utvecklare ska hjälpa dig med din webbdesign portfolio?
Vid en snabb anblick så såg jag bara mindre fel i övriga koden, men inte i den som du postat här.
Är du webbdesigner tycker jag du skriver din javascript lite konstigt, men det är väl upp till var och en.
Har du kollat med firebug eller liknande vart det går fel i koden?

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Test portfolio till webbdesignen i skolan för att vara mer specifik
Webbdesigner är jag inte, långt ifrån
Hmm, inte ens tänkt på firebug öht, ska kolla.

Visa signatur

Flickr

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

vid en snabb anblick, så gissar jag att du har "scope"-problem.
du har alla dina variabler och funktioner i din document ready-funktion, vilket leder till att dessa (förmodligen) inte kommer att finnas när du försöker anropa dem sedan.
testa att flytta ut dessa utanför document ready, så funkar det nog bättre.

en liten fundering också... är det verkligen nödvändigt att wrappa document ready i en extra funktion?

var sections;
var loading;
var content;

function showLoading(){
    // do your stuff!
}

(function(){ // <-- tror inte detta behövs...
    $(document).ready(function(){
        sections = $("#menu li");  
        loading = $("#loading");  
        content = $("#innehall");
    });
})(); // <-- tror inte detta behövs...
Visa signatur

as far as we can tell, the massacre went well...

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Hmm...
Förstår inte riktigt riktigt hur du menar, eller jag fattar vad du menar, men den stora frågan är ju vilka funktioner.
Totalt nybörjare på det här så kan det inte speciellt mycket.

Om jag behöver göra det med document ready funktionen har jag absolut ingen aning om. vet bara att det fungerar med de tidigare jag har gjort.
för när jag la till en script så slutade alla att fungera, googlade lite på det och hittade det där, och det fungerade.

Visa signatur

Flickr

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

slängde ett snabbt öga till på det hela och hittade jQuery.noConflict();, som säkert kan ha med saken att göra. testa att kommenter bort raden (så att det blir //jQuery.noConflict(); alltså) och se om det hjälper.

Visa signatur

as far as we can tell, the massacre went well...

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Verkar otroligt nog fungera!

$.noConflict();
	jQuery(document) .ready(function($) {

sådär provade jag göra. Dock vet jag inte om det är de som gör att de funkar. för nu när jag provade, utan att ha ändrat någonting, fungerade det.. riktigt mysko.

Tack för hjälpen du ger också! Uppskattas verkligen

Visa signatur

Flickr

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av xion_drifter:

Tja!
De är så att jag har ett problem med jQuery som jag fasiken inte lyckas lösa..

Så här är det.
Jag har följt den här tutorialen http://yensdesign.com/2008/12/how-to-load-content-via-ajax-in... med att få innehåll från ett annan dokument att ladda in till en existerande sida.

Ska nämligen ha det till en portfolio sida där innehållet ska laddas till samma sida, lite av ett galleri kan man säga.

Det funkar väldigt bra med javascripten ända tills jag lägger in den i min egna scriptfil, då fungerar inte scripten nå mer, och jag vet inte hur jag ska lösa det..
Scripten "krockar" eller något med de existerande scriptsens i filen.
Har även provat göra en egen scriptfil till laddningsscripten, men med samma resultat.

Här är scripten som laddar innehållet till sidan, eller in i en div om man så vill.

//References  
	var sections = $("#menu li");  
	var loading = $("#loading");  
	var content = $("#innehall");
	
	function showLoading(){  
		loading  
		.css({visibility:"visible"})  
		.css({opacity:"1"})  
		.css({display:"block"});  
	}  
	
		//hide loading bar  
		function hideLoading(){  
			loading.fadeTo(1000, 0);  
			content.slideDown();  
		};

	sections.click(function(){  
		//show the loading bar  
		showLoading();  
		
		//load selected section  
			switch(this.id){  
				case "home":  
				content.slideUp();  
				content.load("sections.html #section_home", hideLoading);  
				break;
					
					case "news":  
					content.slideUp();  
					content.load("sections.html #section_news", hideLoading);  
					break;
					
						default:  
						//hide loading bar if there is no selected section  
						hideLoading();  
						break;  
			}  
	});

och här finns hela javascripten http://xions.freehostia.com/problem/custom.js

Är det någon som vet hur jag löser det här?

Lite dåligt förklarat kanske, inte så bra på att förklara
Om något är oklart så försöker jag förklara lite bättre

Gå till inlägget

Typiskt, bara för att det är webb och modernt så tror alla att dom ska programmera webb/javascript.

Tips från coachen: Använd aldrig globala variabler. Nu här har du declarerat dina variabler i den globala namn-rymden. Det är inte OK.

Har själv inte använt jQuery men kan endå tips om förbättringar:

$(document).ready(function() { ... }) bör stå $(function() { ... });

Där ... ska bytas ut mot all din kod du har utspridd nu.

loading.css({ opacity: 1 }).css({ display: 'block' }) ... bör stå loading.css({ opacity: 1, display: 'block' });

Stort problem: Din sections.click(...) den ska helt bytas ut mot 3st separata anrop:

$('#home').click(function() { ... });
$('#news').click(function() { ... });
...

Voilá!

Redigera
Citera flera Citera
1
Skriv svar
Senaste nyheterna
Hårdvara
Mjukvara
Övrigt
Nytt i forumet
Datorkomponenter
System
Ljud, bild och kommunikation
Spel och mjukvara