weixin_33737774 2017-02-10 07:38 采纳率: 0%
浏览 23

ob_start()-jQuery加载逻辑

I'm working on a system that fetches pages dynamically using AJAX. The pages are fetched like so (index.php):

//Call destructor if any...
//This is defined in the page that we request
if (window.MyModule)
{
    window.MyModule();
    delete window.MyModule;
    window.MyModule = undefined;
}


$('#content').load('requestHandler.php', {'val': index
                                      },
                                      function ()
                                      {
                                        $('#content').fadeIn();
                                      });

Where #content is the div ID of the container (index.php):

<div class="container-fluid" id="content">
   Content comes here as we click on different hyperlinks...
</div>

The pages that are going to be displayed is returned by the php-script requestHandler.php which takes the index and looks up the right page. This works fine if I click a hyperlink once. If I click the hyperlinks twice or more than that I end up with multiple event handlers for the different click events on the page. Due to this I run the destructor function on the page I fetch which look like so, before I request a new page (home.php):

<ul id="report" class="nav nav-tabs" role="tablist">
  <li class="nav-item">
    <a class="nav-link active" id="home_tab" data-toggle="tab" href="#home" role="tab">Home</a>
  </li>
</ul>  


<!-- Tab panes -->
<div class="tab-content">
    <div class="tab-pane active" id="home" role="tabpanel">
        <div class="row"> 

          <div class="col-md-4 text-center">
          </div>

           <div class="col-md-4">
               <div id="line_header" style="visibility: hidden;">
                   <h1 class="display-4 text-center cliente">Linjevalg</h1>
                      <div class="list-group" id="route_list" style="overflow-y: auto;">

                      </div>
               </div>
           </div>

           <div class="col-md-4 text-center">

           </div>
        </div>
    </div>

</div>


<script>

        window.MyModule = (function ()
        {

            var value = undefined;

        $(document).on( "click", "#route_list .list-group-item", function()
        {
            //Handle click event in here
            console.log("We are handling this!");
        });


        function destructor()
        {
            $("#route_list .list-group-item").off('click');
        }

        return destructor;

      })();
</script>

I have been looking at the examples found here: Can dynamically loaded JavaScript be unloaded?.

But whatever I do the click event fire the same amount of times as the same page is requested even if I call the destructor function. Does this mean that since the same DIV id is assigned multiple times (due to that the same page is rendered) all click-event handlers will be invoked since it already knows about the div ID? The pages are by the way loaded by returning the content from (requestHandler.php):

    ob_start();
    include indexToPageName(index);
    return ob_get_clean();

since they contain PHP-code.

Thanks for any help or guidance!

  • 写回答

2条回答

      报告相同问题?

      相关推荐 更多相似问题

      悬赏问题

      • ¥15 使用自定义的类型代替内置类型可行吗
      • ¥15 关于STM32的SPI和ENDAT接口编码器通信的问题
      • ¥15 关于#pdfbox#生成的PDF文件正常,转图片中文乱码的问题,如何解决?
      • ¥15 ADS中有关DAC控件的使用问题
      • ¥15 win11如何运行geoserver
      • ¥15 审稿意见请教-用ERNIE进行小样本分类的对比实验问题
      • ¥15 gem5搭建arm v8
      • ¥15 安卓时间管理APP,怎么做
      • ¥15 这段有什么bug 为什么总报错
      • ¥15 Intel Realsense深度相机(D415/D435)拍摄梯子获取梯子点云