Fancybox ajax加载内容＆＃34; Onclick脚本＆＃34;在每个fancybox加载

Question

使用fancybox在弹出窗口中加载ajax内容（html / javascript）

On the first click, ajax loaded js function in popup are working fine(single call).
On the second click, ajax loaded js function are called twice in popup.
On the third click, ajax loaded javascript function are called thrice and So on..

我通过警告检查javascript功能。它会发出警报，多次等于每次点击时加载的fancybox。我不知道为什么它表现得那样。我想我需要清除fancybox中以前加载的内容。

$(".various").fancybox({
            modal           : false,
            showCloseButton : true,
            helpers         : {
                                overlay: {
                                    css: {
                                        'background': 'rgba(58, 42, 45, 0.3)'
                                    }
                                }
                              },
            closeBtn        : true,
            closeClick      : false,
            maxWidth        : 1200,
            maxHeight       : 850,
            fitToView       : false,
            width           : '85%',
            height          : '85%',
            autoSize        : false,
            openEffect      : 'none',
            closeEffect     : 'none'
        });

在代码上方，我习惯于点击一个＆gt; href LINK TO＆＃34; POPUP.HTML＆＃34;来调用fancybox ajax调用。一切都很好，除了fancybox弹出窗口上的javascript警报。

POPUP.HTML

    <table class="table table-striped table-bordered table-hover" id="popupGridTable">
        <thead>
            <tr>
                <th>Rendering engine</th>
                <th>Browser</th>
                <th>Platform(s)</th>
                <th>Engine version</th>
                <th>CSS grade</th>
            </tr>
        </thead>
        <tbody>
            <tr class="odd gradeX" id="row1">
                <td>Trident</td>
                <td>Internet Explorer 4.0</td>
                <td>Win 95+</td>
                <td class="center">4</td>
                <td class="center">X</td>
            </tr>
            <tr class="even gradeC" id="row2">
                <td>Trident</td>
                <td>Internet Explorer 5.0</td>
                <td>Win 95+</td>
                <td class="center">5</td>
                <td class="center">C</td>
            </tr>
            <tr class="odd gradeA" id="row3">
                <td>Trident</td>
                <td>Internet Explorer 5.5</td>
                <td>Win 95+</td>
                <td class="center">5.5</td>
                <td class="center">A</td>
            </tr>
            <tr class="even gradeA" id="row4">
                <td>Trident</td>
                <td>Internet Explorer 6</td>
                <td>Win 98+</td>
                <td class="center">6</td>
                <td class="center">A</td>
            </tr>
        </tbody>
    </table>
<!-- ONCLICK ON TBODY > TR CALLS THE JS FUNCTION THAT MANY TIMES EQUAL TO FANCYBOX POPUP -->
    <script type="text/javascript">
        $(document).ready(function(){
            var table = $('#popupGridTable').DataTable();
            $('body').on("click", '#popupGridTable tbody tr' ,function () {
                //alert('called that many times equal to number of click on fancybox popup');
                var id = $(this).attr('id');
                $('#popupGridTable tbody tr').removeClass('row_selected');
                $(this).addClass('row_selected');
                parent.setInformation(id);
                return;
            });
        });
    </script>

我使用了afterClose调用来清除html内容。但仍面临同样的问题。

请帮我解决这个问题。

提前致谢