I’m posting simple version of php and Jquery code of the page that I need to create.
As you can see, this example contains PHP break functions, and the name of this page is test.php.
The problem is, when I try to open the first part of this page (case 1) Jquery load function successfully is started and successfully load case 2 in the same DIV the second Jquery code for alert message. But if FireFox and Chrome that alert message it would not show up. Why?
Thx.
The code of the compleate page is:
<?php
include_once '../include/config.inc.php';
include_once '../include/options.inc.php';
include_once '../include/security.inc.php';
include_once '../include/functions.inc.php';
include_once '../templates/config.php';
?>
<script type="text/javascript" src="jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#one").live("click", function(){
$("#xuy").load("test.php?x=2");
});
});
</script>
<script type="text/javascript">
$(document).ready(function() {
$('#test').click(function() {
alert("test for alert message");
});
});
</script>
<style>
#xuy{ width:770px; height:230px; border:1px solid #999; background-color:#33FF00;}
#one{ border:1px solid #F00; width:555px; background-color:#FFFF00;}
#two{ border:1px solid #000; width:355px; background-color:#CCCCCC;}
#three{ border:1px solid #ccc; width:255px; background-color: #00FFFF;}
</style>
<?
if (!isset($x)) $x = '';
switch ($x)
{
default:
case 1:
?>
<div id="xuy"><div id="one">DIV one</div></div>
<?
break;
case 2:
?>
<div id="two">DIV two</div><br>
<div id="test">click for Jquery alert</div>
<?
}
?>
I think the problem is not with the break, but the following:
When you first open the page, the $(document).ready handler is fired. In this handler you try to bind to the event $(‘#test’).click, but #test does not exist yet!
Then you load the second page by calling:
$("#xuy").load("test.php?x=2");This starts an AJAX call and inserts the result into the DIV called “xuy”. You insert $(document).ready again into the HTML, but the handler is not called, because the document is already “ready”. So your event handler to $(‘#test’).click ist not attached!
You would have to do this inside a tag in the loaded file, such as: