2012-08-10 11 views
6

I einfache HTML-Seite öffnen:Wie JQuery UI Popup Onclick

<html> 
<head> 
<title></title> 
</head> 
<body> 
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/redmond/jquery-ui.css" rel="stylesheet" type="text/css"/> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 


    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#OpenDialog").click(function() { 
       $("#dialog").dialog({modal: true, height: 590, width: 1005 }); 
      }); 
     }); 
    </script> 
    <a id="#OpenDialog" href="#">Click here to open dialog</a> 
    <div id="dialog" title="Dialog Title"> 
     <p>test</p> 
    </div> 

</body> 
</html> 

Ich brauche Popup-Inhalt haben, versteckt und wenn Sie auf den Link, um ein Dialogfeld zu öffnen.

Worin liege ich in meinem Code falsch?

Danke!

Antwort

25

id von Element soll nicht # darin haben, wenn Sie jQuery selector verwenden möchten, wie Sie in $("#OpenDialog").click(

Change verwendet

<a id="#OpenDialog" href="#">Click here to open dialog</a>  

Um

<a id="OpenDialog" href="#">Click here to open dialog</a> 
+2

Grund für die Abstimmung unten? – Adil

+3

Es gibt keinen guten Grund, diesen zu verwerfen, Adil hat Recht. Sie fügen das # nicht in die ID des tatsächlichen Markups ein, nur wenn Sie es von einem Selektor wie jQuery oder CSS referenzieren. In diesem Fall wird der Click-Handler niemals dem Element "OpenDialog" zugewiesen, weil er nicht existiert. – mclark1129

5

Änderung der id von der Link von #OpenDialog zu OpenDialog