Question

我被困在非常正常的scnerio。我有由YII CLINK PAGER Pagination小部件生成的HTML代码：

<ul class="yiiPager" id="yw0">
      <li class="first hidden"><a href="/advisory_system/administrator/index.php/specialCategory/gridview?optget_grid=&amp;analysis_type=4&amp;_=1410520989427">&lt;&lt; First</a></li>
      <li class="previous hidden"><a href="/advisory_system/administrator/index.php/specialCategory/gridview?optget_grid=&amp;analysis_type=4&amp;_=1410520989427">&lt; Previous</a></li>
      <li class="page selected"><a href="/advisory_system/administrator/index.php/specialCategory/gridview?optget_grid=&amp;analysis_type=4&amp;_=1410520989427">1</a></li>
      <li class="page"><a href="/advisory_system/administrator/index.php/specialCategory/gridview?optget_grid=&amp;analysis_type=4&amp;_=1410520989427&amp;page=2">2</a></li>
 </ul>

我希望AJAX分页符合我的要求，所以我写了Jquery代码：

 $("ul.yiiPager li.page a").on('click',function (e){
        e.preventDefault();
        alert($(this).attr('href'));
        return false;
        loadlistData($(this).attr('href'));
    });

但是，点击任意<a>标记，它会重定向到href中给出的LINK ，以防止我使用了e.preventDefault();，但仍然没有进入JQuery代码和警报没有显示。

请帮忙。提前谢谢。

Answer 1

因为你的锚标签是动态创建的。您需要使用事件委派。因为元素应该在事件绑定时出现在dom上。如果事件委托事件被绑定到dom上显示的document或父元素

$(document).on('click', "ul.yiiPager li.page a", function(e) {
    e.preventDefault();
    alert($(this).attr('href'));
    loadlistData($(this).attr('href'));
});

Answer 2

案例1（直接）：

$（＆＃34; ul.yiiPager li.page a＆＃34;）。on（＆＃34; click＆＃34;，function（）{...}）; 我希望每个ul.yiiPager li.page都在ul.yiiPager li.page里面听一听：当你点击它时，做一些事情。

案例2（委托）：

$（＆＃34; ul.yiiPager li.page＆＃34;）。on（＆＃34; click＆＃34;，＆＃34; a＆＃34;，function（）{...}）; ul.yiiPager li.page当你的任何一个子元素是＆＃34; a＆＃34;点击，用它们做点什么。

摘要

在案例1中，每个跨度都已单独给出说明。如果创建了新的跨度，他们就不会听到指示并且不会对点击做出响应。每个a都直接负责自己的事件。

在案例2中，只有容器被给予指示;它负责代表其子元素注意点击。捕获事件的工作已被委派。

防止标记重定向到URL

2 个答案: