打开多个Jquery UI对话框。每个都有不同的内容

时间:2012-03-14 23:31:37

标签: jquery user-interface dialog

我老老实实地工作了大约两个星期并且尽可能地进行了研究。我试图做的就是在网站一侧有各种图像。单击其中一个会出现一个对话框,其中包含内容。我可以让一个对话框工作,但第二个不会打开一个对话框。我尝试过使用.dialog('open')命令,但它似乎没有完成目标。这是我到目前为止的代码,任何帮助将不胜感激。

<BODY>

<LINK rel=stylesheet type=text/css href="css/ui-lightness/jquery-ui-1.8.18.custom.css"> 
<SCRIPT type=text/javascript src="js/jquery-1.7.1.min.js"></SCRIPT>
<SCRIPT type=text/javascript src="js/jquery-ui-1.8.18.custom.min.js"></SCRIPT>

<A id=infopic href="#"><IMG style="Z-INDEX: 101; POSITION: absolute; TOP: 210px; LEFT: 211px" border=0 src="iconplace.png"></A> 

<DIV style="DISPLAY: none" id=info>info</DIV>

    <SCRIPT language=javascript type=text/javascript>

  $("#infopic").click(function() {

        $("#info").dialog({
            autoOpen:"false", 
            stack:"true",
            height: "600",
            width: "700",
            resizable: "false",
            Title: "Info"
            });

     })

    </SCRIPT>

<A id=portfoliopic href="#"><IMG style="Z-INDEX: 102; POSITION: absolute; TOP: 102px; LEFT: 390px" border=0 src="iconplace.png"></A>

<DIV style="DISPLAY: none" id=portfolio title=Portfolio>Portfolio pics</DIV>

  <SCRIPT language=javascript type=text/javascript>

  $("#portfoliopic").click(function() {

        $("portfolio").dialog({
            autoOpen:"false", 
            stack:"true",
            height: "600",
            width: "700",
            resizable: "false"
            });

     })

    </SCRIPT>


</BODY></HTML>

另一方面,这在Firefox或Safari中不起作用,但适用于谷歌浏览器和IE浏览器。对此的任何猜测都会有所帮助。

1 个答案:

答案 0 :(得分:0)

$("portfolio").dialog({更改为$("#portfolio").dialog({。这应该让第二个对话框起作用。

我重新审视了@ Ohgodwhy关于清理代码的建议。