Question

我很难让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隐藏起来。我确信这是一个简单的解决方案，但我似乎无法找到它。在此先感谢您的帮助

Answer 1

您必须在document-ready函数

中的$(function(){...});中绑定事件

$(function(){
    $('#dialog').dialog();

    $('#switch').click(function(){
       $('#number1').hide();
       $('#number2').show();
    });

});

对话框中的Jquery

1 个答案: