jQuery UI对话框，AJAX没有第二次运行点击功能

I have a strange bug with jQuery UI dialog & AJAX.

This is the process:

1. click on link > link open div with AJAX.
2. in AJAX div click on link > open jQuery UI dialog with another AJAX.
3. click on link in jQuery UI AJAX dialog > do alert() message with JavaScript.

Now I do the same process right from the start, Everything works fine until the stage of the alert() message. So if i do the process next time step 3 not work and im not get any error in my console.

Code for step 2 (open jQuery UI dialog with AJAX):

function update_link(rel)
{
   $("#update_link").dialog({
            modal: false,
            height: 370,
            width: 900,
            title: 'im title',
            open: function () {
                $(this).load("<?= site_url()?>/links/show_update?id="+rel+"&rand="+rand());

            }
     });

}

Code to get the alert message in step 3 (this code is in the jQuery UI dialog page):

$("#to_page_home").on("click", function (){
    alert("im not work if you open me in AJAX again!");
});

If I do this instead of code, it also doesn't work:

<a href="#" id="to_page_home" onclick="alert('im not work if you open me in AJAX again!');">

Thank you all and sorry for my bad english.

Do you toggle #to_page_home at any point? If that ID disappears/reappears, your on() won't re-register when it re-appears

Look at the Direct and Delegated events section of the doc . . . you'll probably need something like this:

$("#parentContainer").on("click", "#to_page_home', function (){
    alert("im not work if you open me in AJAX again!");
});

In this case, the element with ID parentContainer would have to contain the element with to_page_home, and would have to be permanently on the page.