2013-11-15 4 views
0

Мне трудно получить jquery для работы в диалоговом окне. У меня есть следующий код: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, чтобы скрыть. Я уверен, что есть простое решение, но я не могу найти его. Заранее спасибо за помощь

ответ

1

Вы должны связать событие в $(function(){...}); в document-ready функции

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

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

}); 
+0

Это сработало! Спасибо! – user791187

+0

@ user791187, рад, что смогу помочь – Satpal

Смежные вопросы