jQuery

hhuq

Member

Posts: 289

Location: Berlin

Occupation: Schüler

1

Wednesday, March 28th 2012, 1:24pm

Hi,
ich taste mich an jQuery ran, finds einfach grandios was man damit, wenn man es kann, anstellen kann...

Wie gesagt, ich teste gerade so ein wenig was ich kann bzw. übe mich rein sag ich mal...

Frage:

Wie führe ich in jQuery CSS-Anweisungen aus?

Frage 2:

Source code

$(document).ready(function() {
		$('#noklick').fadeOut('fast', function() { });
	});
	$('#klicken').click(function() {
		$('#klicken').fadeOut('slow', function() { });
		$('#noklick').fadeIn('slow', function() { });
	});
	$('#noklick').click(function() {
		$('#wait').slideUp(300).delay(800).fadeIn(300);
		alert("Wie gesagt, tun Sie's nicht!");
	)};

Bis zu dem //hier macht er alles, ich kanns mir denken woran es liegt, kann es aber nicht beschreiben, kann jemand mal bitte Korrektur lesen und dann sagen?

Meine Plugins:

Stilseite (Aktuelle Version: 1.1.0)

Go to the top of the page

Black Rider

Moderator

Posts: 26,832

2

Wednesday, March 28th 2012, 1:41pm

http://api.jquery.com/category/css/

Mit freundlichen Grüßen
Best regards

KittBlog Stile - Ihr Kit für Stile, Software und Knowhow
Your kit for styles, software and knowhow

Erste Linkliste zu Erweiterungen und Support rund um Burning Board©
First linklist for plugins and support around Burning Board©

Go to the top of the page

hhuq

Member

Posts: 289

Location: Berlin

Occupation: Schüler

3

Wednesday, March 28th 2012, 1:47pm

Ok, erste Frage geklärt ...
Zweite Frage?!

Meine Plugins:

Stilseite (Aktuelle Version: 1.1.0)

Go to the top of the page

Black Rider

Moderator

Posts: 26,832

4

Wednesday, March 28th 2012, 2:35pm

Bis wohin macht er alles?
Und was soll dann noch kommen?

Mit freundlichen Grüßen
Best regards

KittBlog Stile - Ihr Kit für Stile, Software und Knowhow
Your kit for styles, software and knowhow

Erste Linkliste zu Erweiterungen und Support rund um Burning Board©
First linklist for plugins and support around Burning Board©

Go to the top of the page

hhuq

Member

Posts: 289

Location: Berlin

Occupation: Schüler

5

Wednesday, March 28th 2012, 2:36pm

Wenn man auf #klick drückt, soll der #noklick erscheinen.
Wenn man dann auf #noklick drückt soll man ein Fenster erscheinen...

Meine Plugins:

Stilseite (Aktuelle Version: 1.1.0)

Go to the top of the page

Black Rider

Moderator

Posts: 26,832

6

Wednesday, March 28th 2012, 3:46pm

Entferne die Rauten, außer, du hast sie im Quellcode als id="#klick" stehen, wovon ich nicht ausgehe.

Mit freundlichen Grüßen
Best regards

KittBlog Stile - Ihr Kit für Stile, Software und Knowhow
Your kit for styles, software and knowhow

Erste Linkliste zu Erweiterungen und Support rund um Burning Board©
First linklist for plugins and support around Burning Board©

Go to the top of the page

Oberster Hirte

Member

Posts: 9,156

7

Wednesday, March 28th 2012, 4:03pm

Eigentlich sind die Rauten richtig, JQuery nimmt CSS-Formate, also $('#id'), $('.class.class div') und so weiter.

Go to the top of the page

Andoca

Member

Posts: 41

8

Wednesday, March 28th 2012, 4:14pm

hallo!

poste doch mal ein vollständiges beispiel inkl. html code von <html> bis </html>. die raute stimmt schon, sofern er mit IDs arbeitet, dafür wäre aber der html code relevant.

mfg

www.andoca.de - Wir bauen Communities! WCF/WBB Plugins (große Auswahl auf unserer Homepage und im Pluginstore) und Community-Services

Go to the top of the page

Black Rider

Moderator

Posts: 26,832

9

Wednesday, March 28th 2012, 4:16pm

Quoted from "Oberster Hirte"

Eigentlich sind die Rauten richtig, JQuery nimmt CSS-Formate, also $('#id'), $('.class.class div') und so weiter.

Stimmt, sorry.

Bin grade in Prototype drin... :whistling:

Mit freundlichen Grüßen
Best regards

KittBlog Stile - Ihr Kit für Stile, Software und Knowhow
Your kit for styles, software and knowhow

Erste Linkliste zu Erweiterungen und Support rund um Burning Board©
First linklist for plugins and support around Burning Board©

Go to the top of the page

abstractizm

Member

Posts: 1

10

Wednesday, March 28th 2012, 4:27pm

Optimierung...

Hi,
hier noch ein paar Tipps, die Deinen Code optimieren.

speichere die DOM Objekte in einer Variabel, somit braucht er sie nur einmal auszulesen.
HTML

1 2 3 4 5

var obj = $('#obj'); obj.fadeIn('slow'); obj.bla(); obj.blub();
.click sollte man seit jQuery 1.7 mit .on() ersetzt.
HTML

1

zB: obj.on("click", notify);

vermeide Anonyme Funktionen.

	HTML
1 2	function notify() { alert("clicked"); } $("button").on("click", notify);

wenn es zum Seitenstart nicht angezeigt werden soll, stell es lieber per css aus. display:none;
fadeOut Callback ist optional.
HTML

1

$('#obj').fadeOut('slow');
.addClass() ist perfomanter als .css()

Generell kannst Du Dir merken, alles was Dein DOM manipuliert ist unperfomant. Das gilt auch für das Auslesen von DOM Objekten $('#myDiv') und zuweisen von Events.

Liebe Grüße,
abs

Go to the top of the page

Hawkes

Member

Posts: 5,963

Location: Konstanz

Occupation: Student (Physik)

11

Wednesday, March 28th 2012, 5:01pm

Quoted from "abstractizm"

vermeide Anonyme Funktionen.

Wieso denn das? Kleine Eventfunktionen bekommen bei mir niemals nen Namen, da wird man ja dusselig, wenn ich für jede success, o.ä. Funktion eine eigene benannte Funktion anlegen muss.

Kein Support von Plugins per PN, Mail oder IM! Alte Plugins, die ich nicht mehr im Plugin-Store anbiete, werden nicht mehr supportet. Bitte von Anfragen absehen.
Meine Plugins und Projekte

Go to the top of the page

hhuq

Member

Posts: 289

Location: Berlin

Occupation: Schüler

12

Wednesday, March 28th 2012, 5:08pm

Der Code ist jetzt auf Arbeit (Praktikum), kann mir dennoch jemand sagen, wie ich, da ich aus einem YT-Tutorial nicht schlau wurde, wenn ich:

In ein Inputfeld was eintrage, dieses dann in der Datenbank (mySQL) abfrage ohne die Seite zu wechseln/neu zu laden?

Meine Plugins:

Stilseite (Aktuelle Version: 1.1.0)

Go to the top of the page

Andoca

Member

Posts: 41

13

Wednesday, March 28th 2012, 5:58pm

siehe http://api.jquery.com/jQuery.ajax/ bzw http://api.jquery.com/load/

www.andoca.de - Wir bauen Communities! WCF/WBB Plugins (große Auswahl auf unserer Homepage und im Pluginstore) und Community-Services

Go to the top of the page

hhuq

Member

Posts: 289

Location: Berlin

Occupation: Schüler

14

Thursday, March 29th 2012, 12:23pm

Hi nochmal,
ich hab jetzt folgendes:

Source code

<body>
	<div id="ausgabe">
		Klick hier um das Anmeldeformular zu öffnen!
	</div>
	<form method="post" action="" id="mf">
		<input type="text" name="test" /><input type="button" id="button" value="Testbutton" />
	</form>
	<div id="output">
		<? echo $_POST['test']; ?>
	</div>
	<script src="jquery.js"></script>
	<script>
		$(document).ready(function() {
			$('#mf').fadeOut('slow', function() { });
			$('#test').fadeOut('slow', function() {});
		});
		$('#ausgabe').click(function() {
			$('#ausgabe').fadeOut('slow', function() { });
			$('#mf').fadeIn('slow', function() { });
		});
		$('#button').click(function() {
			$('#mf').fadeOut('slow', function() { });
			$('#output').fadeIn('slow', function() { });
		});
	</script>
</body>

Wenn ich auf den Button drücke lässt er das Forumlar zwar verschwinden, gibt aber nichts aus!

Meine Plugins:

Stilseite (Aktuelle Version: 1.1.0)

Go to the top of the page

Andoca

Member

Posts: 41

15

Thursday, March 29th 2012, 12:55pm

was soll denn

	Source code
1	$('#test').fadeOut('slow', function() {});

machen? ein element mit der ID test hast du nicht. die ganzen beiden ersten fadeOuts solltest du weglassen, blende die elemente mit display: none aus.

www.andoca.de - Wir bauen Communities! WCF/WBB Plugins (große Auswahl auf unserer Homepage und im Pluginstore) und Community-Services

Go to the top of the page

hhuq

Member

Posts: 289

Location: Berlin

Occupation: Schüler

16

Thursday, March 29th 2012, 2:06pm

stimmt, ok, aber meine Frage hebt dies nicht auf ...
Wenn ich auf den Button drücke lässt er das Forumlar zwar verschwinden, fadet auch "output" ein aber gibt aber nichts aus!

Meine Plugins:

Stilseite (Aktuelle Version: 1.1.0)

Go to the top of the page

Andoca

Member

Posts: 41

17

Thursday, March 29th 2012, 2:18pm

was sollte er denn ausgeben? beim klick auf "button" blendest du die form aus und output ein.

oder erwartest du, dass der php code der da steht ausgewertet wird und dir der inhalt von dem input feld angezeigt wird? das wäre unsinn - php ist eine server seitige sprache, javascript (und damit jquery) eine client seitige. damit php etwas damit machen kann, müsstest du erst die daten an den server schicken. klassisch mit dem formular und einem neuladen der seite oder auch mit ajax.

mfg

www.andoca.de - Wir bauen Communities! WCF/WBB Plugins (große Auswahl auf unserer Homepage und im Pluginstore) und Community-Services