对话框中的 Jquery

Jquery within dialog box

本文关键字：Jquery 对话框      更新时间：2023-09-26

我很难让jquery在对话框中工作。 我有以下代码：

<html>
    <head>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js" type="text/javascript"></script>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <script>
    $(function(){
        $('#dialog').dialog();
    });
    $('#switch').click(function(){
        $('#number1').hide();
        $('#number2').show();
    });
    </script>
<style>
#number2{
    display:none;
}
</style>
</head>
<body>
<div id="dialog" title="blank">
<div id="number1">
    <form>
        <p><input type="text" name="text"></p>
        <p><input type="radio" name="one" value="one">One</p>
        <p><input type="radio" name="one" value="two">Two</p>
        <p><input type="radio" name="one" value="three">Three</p>
        <p><input type="submit" name="submit" value="submit"></p>
        <p id="switch">click here to switch</p>
    </form>
</div><!--End of #1-->
<div id="number2">
    <h1>div number 2</h1>
</div><!--End of #2-->
</div>
</body>
</html>
我

只是想弄清楚为什么我不能让div #2 显示和div #1 隐藏。 我确定有一个简单的解决方案，但我似乎找不到它。 提前感谢您的帮助

您必须在

文档就绪函数中绑定$(function(){...});中的事件

$(function(){
    $('#dialog').dialog();
    $('#switch').click(function(){
       $('#number1').hide();
       $('#number2').show();
    });
});
相关文章：