如何在使用ajax响应刷新数据后将jquery对话框与html元素绑定


How to bind a jquery dialog with html element after refreshing the data using ajax response?

在我的php页面中,我得到了一个jquery脚本来打开一个对话框窗口。代码为

<script type="text/javascript">
            $(document).ready(function() {
                var $loading = $('<img src="loading.gif" alt="loading" class="loading">');
                $('#data-specs a').each(function() {
                    var $dialog = $('<div></div>')
                        .append($loading.clone());
                    var $link = $(this).one('click', function() {
                        $dialog
                            .load($link.attr('href'))
                            .dialog({
                                title: '<?php echo $_GET["indQ"];?>',
                                modal: true,
                                width: 500,
                                height: 300,
                                minHeight: 300,
                                maxHeight: 600,
                                minWidth: 500,
                                maxWidth: 800
                                });
                            $link.click(function() {
                            $dialog.dialog('open');
                            return false;
                        });
                        return false;
                    });
                });
                $('#dav').val(getURLParameter('davQ'));
                $('#pathogen').val(getURLParameter('pathogenQ'));
                $('#topicF').val(getURLParameter('topicQ'));
                $('#ind').val(getURLParameter('indQ'));
                $('#subind').val(getURLParameter('subindQ'));
                $(".selfont").change(function (event) {
                        window.location = '?davQ=' + $('#dav').val() + '&pathogenQ=' + $('#pathogen').val() + '&topicQ=' + $('#topicF').val() + '&indQ=' + encodeURIComponent($('#ind').val()) + '&subindQ=' + encodeURIComponent($('#subind').val());
                });
                function getURLParameter(name) {
                         return decodeURIComponent((RegExp(name + '=' + '(.+?)(&|$)').exec(location.search) || [, null])[1]);
                }
            });
    </script>

数据在一个id为"data-specs"的表中。而且效果很好。最近,我添加了一个带有值的下拉框,用ajax脚本对这个表进行排序,它也很有效。但问题是,在这个ajax调用之后,当我单击链接打开对话框时,它会在父窗口中打开,如果我们按下浏览器后退按钮,然后单击链接,它会打开对话框,不会出错!!即使在使用ajax完成排序之后,我如何才能纠正这一点?请给我一些解决方案。我要排序的ajax代码如下所示

function ajaxFunction(){
    //to keep selection in countryList - GP
    var ref = document.getElementById('countryRF');
    for(i=0; i<ref.options.length; i++)
    ref.options[i].selected = true;

    var ajaxRequest;  // The variable that makes Ajax possible!
    try{
        // Opera 8.0+, Firefox, Safari
        ajaxRequest = new XMLHttpRequest();
    } catch (e){
        // Internet Explorer Browsers
        try{
            ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try{
                ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e){
                // Something went wrong
                alert("Your browser broke!");
                return false;
            }
        }
    }
    // Create a function that will receive data sent from the server
    ajaxRequest.onreadystatechange = function(){
        if(ajaxRequest.readyState == 4){
            //document.myForm.time.value = ajaxRequest.responseText;
            document.getElementById("result").innerHTML=ajaxRequest.responseText
        }
    }
    var dav = document.getElementById('dav').value;
    var pathogen = document.getElementById('pathogen').value;
    var topicF = document.getElementById('topicF').value;
    var ind = document.getElementById('ind').value;
    var subind = document.getElementById('subind').value;
    var selObj = document.getElementById('countryRF');
    var cnty = loopSelected(selObj).join('~');  // join array into a string
    var sortby = document.getElementById('sortby').value;
    var queryString = "?dav=" + dav + "&pathogen=" + pathogen + "&topicF=" + topicF + "&ind=" + encodeURIComponent(ind) + "&subind=" + encodeURIComponent(subind) + "&cnty=" + encodeURIComponent(cnty) + "&sortby=" + sortby;
    ajaxRequest.open("GET", "sortbyD.php" + queryString, true);
    ajaxRequest.send(null);
    return false;
}

请帮我解决这个问题。。

当页面第一次加载时,对话框事件与元素绑定,在ajax之后,您需要再次使用.bind()函数绑定对话框事件