Jquery Hilfe - Demo funktioniert nicht.

KonstantinV · 29 Mai 2013

Hallo,

ich habe gerade versuch eine Demo aus dem Jquery UI zu übernehmen. Jedoch bekomme ich jedesmal eine Fehlermeldung in der Konsole.

Fehlermeldung: cannot call methods on dialog prior to initialization; attempted to call method 'open'

Das ist der Quelltext aus der Demo (alternativ Dialog | jQuery UI):

Code:

[COLOR=#999999][FONT=source-code-pro][B]<!doctype html>[/B][/FONT][/COLOR]
 

[COLOR=#000080]<html [COLOR=#008080]lang[/COLOR]=[COLOR=#DD1144]"en"[/COLOR]>[/COLOR]

[COLOR=#000080]<head>[/COLOR]

  [COLOR=#000080]<meta [COLOR=#008080]charset[/COLOR]=[COLOR=#DD1144]"utf-8"[/COLOR] />[/COLOR]

  [COLOR=#000080]<title>[/COLOR]jQuery UI Dialog - Animation[COLOR=#000080]</title>[/COLOR]

  [COLOR=#000080]<link [COLOR=#008080]rel[/COLOR]=[COLOR=#DD1144]"stylesheet"[/COLOR] [COLOR=#008080]href[/COLOR]=[COLOR=#DD1144]"http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"[/COLOR] />[/COLOR]

  [COLOR=#000080]<script [COLOR=#008080]src[/COLOR]=[COLOR=#DD1144]"http://code.jquery.com/jquery-1.9.1.js"[/COLOR]>[/COLOR][COLOR=#000080]</script>[/COLOR]

  [COLOR=#000080]<script [COLOR=#008080]src[/COLOR]=[COLOR=#DD1144]"http://code.jquery.com/ui/1.10.3/jquery-ui.js"[/COLOR]>[/COLOR][COLOR=#000080]</script>[/COLOR]

  [COLOR=#000080]<link [COLOR=#008080]rel[/COLOR]=[COLOR=#DD1144]"stylesheet"[/COLOR] [COLOR=#008080]href[/COLOR]=[COLOR=#DD1144]"/resources/demos/style.css"[/COLOR] />[/COLOR]

  [COLOR=#000080]<script>[/COLOR]

  $([B]function[/B]() {

    $( [COLOR=#DD1144]"#dialog"[/COLOR] ).dialog({

      autoOpen: false,

      show: {

        effect: [COLOR=#DD1144]"blind"[/COLOR],

        duration: [COLOR=#009999]1000[/COLOR]

      },

      hide: {

        effect: [COLOR=#DD1144]"explode"[/COLOR],

        duration: [COLOR=#009999]1000[/COLOR]

      }

    });

 

    $( [COLOR=#DD1144]"#opener"[/COLOR] ).click([B]function[/B]() {

      $( [COLOR=#DD1144]"#dialog"[/COLOR] ).dialog( [COLOR=#DD1144]"open"[/COLOR] );

    });

  });

  [COLOR=#000080]</script>[/COLOR]

[COLOR=#000080]</head>[/COLOR]

[COLOR=#000080]<body>[/COLOR]

 

[COLOR=#000080]<div [COLOR=#008080]id[/COLOR]=[COLOR=#DD1144]"dialog"[/COLOR] [COLOR=#008080]title[/COLOR]=[COLOR=#DD1144]"Basic dialog"[/COLOR]>[/COLOR]

  [COLOR=#000080]<p>[/COLOR]This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.[COLOR=#000080]</p>[/COLOR]

[COLOR=#000080]</div>[/COLOR]

 

[COLOR=#000080]<button [COLOR=#008080]id[/COLOR]=[COLOR=#DD1144]"opener"[/COLOR]>[/COLOR]Open Dialog[COLOR=#000080]</button>[/COLOR]

 

 

[COLOR=#000080]</body>[/COLOR]

[COLOR=#000080][FONT=source-code-pro]</[/FONT][/COLOR][COLOR=#000080][FONT=source-code-pro]html[/FONT][/COLOR][COLOR=#000080][FONT=source-code-pro]>[/FONT][/COLOR]

Ich hoffe mir kann wer helfen.. ich kann nicht viel mit der Fehlermeldung anfangen.

Besten dank und liebe Grüße,

Konstantin

Tronjer · 29 Mai 2013

Es wird wahrscheinlich schon deshalb nicht funktionieren, weil die ID #opener beim Funktionsaufruf noch nicht existiert. Also entweder das Script am Fuß der Seite platzieren oder $(document).ready() verwenden.

Sempervivum · 30 Mai 2013

Hallo Tronjer,
dieses Script benutzt $(function() {}), das ist äquivalent zu $(document).ready().

Hallo Konstantin,
also bei mir funktioniert dieser Code einwandfrei, sowohl wenn ich das nehme, was Du gepostet hast, als auch wenn ich das Original von jQuery-UI verwende. Was benutzt Du für einen Browser? Ich habe FF 21 und habe es auch mit IE9 getestet.

KonstantinV · 4 Juni 2013

Sorry für die späte Antwort. Es lag an den script Dateien, ich habe sie fehlerhaft importiert.

Aber danke für die Hilfe :)

Jquery Hilfe - Demo funktioniert nicht.

KonstantinV

Neues Mitglied

Tronjer

Senior HTML'ler

Sempervivum

Guest

KonstantinV

Neues Mitglied

Neueste Beiträge