Question

我在要加载文件的页面上有这个脚本

<SCRIPT type="text/javascript">
$(function() 
{           
        $("#storefront").click(function () {
            alert("POTANGINA");
           $(".centerdiv").load("storefront_a.php");
       });  

});             
</SCRIPT>

我在要加载的页面上有这个脚本（storefront_a.php）

<SCRIPT type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></SCRIPT>
<SCRIPT type="text/javascript" src="http://cssglobe.com/lab/easypaginate/js/easypaginate.js"></SCRIPT>
<script type="text/javascript">

    jQuery(function($){

        $('ul#items').easyPaginate({
            step:5
        });

    });    

</script>

<style>
        #page li {
          display: inline;
          position: relative;
          width: 11em
          margin:10px; 
          padding:10px;
        }
        #page li li{ display: block; height: 1.5em;}

</style>


<div id = "page">       
<ul id="items">
    <li>Page 1</li>
    <li>Page 2</li>
    <li>Page 3</li>
    <li>Page 4</li>
    <li>Page 5</li>
    <li>Page 6</li>
    <li>Page 7</li>
    <li>Page 8</li>
    <li>Page 9</li>
    <li>Page 10</li>
    <li>Page 11</li>
    <li>Page 12</li>
    <li>Page 13</li>
    <li>Page 14</li>
</ul>
</div>

当我直接从localhost运行storefront_a.php时，它工作了。但是当我使用load（）调用它时实际上正在加载但是javascript没有用。请帮助我谢谢

Answer 1

如果动态添加storefront元素，那么click将无效，因为如果该元素在页面加载时不可用，则jQuery无法附加事件处理程序。

您必须基本上使用delegate或on为动态创建的元素添加事件处理程序。

 $(document).on("click", "#storefront", function () {
     alert("POTANGINA");
     $(".centerdiv").load("storefront_a.php");
 });

您可以指定页面上可用的document元素的父容器，而不是storefront。

请注意，jQuery ver 1.7中引入了on。如果您使用的是旧版本，请使用delegate

 $(document).delegate("#storefront", "click", function () {
     alert("POTANGINA");
     $(".centerdiv").load("storefront_a.php");
 });

参考文献：

.on() - http://api.jquery.com/on/
.delegate() - http://api.jquery.com/delegate/

Answer 2

包括最新的jQuery＆amp;使用jQuery live方法。

  $("#storefront").live('click',function () {}

脚本不适用于load（）函数

2 个答案: