Question

使用Ajax将以下HTML加载到HTML页面的div中，我想在用户点击该HTML中的a.start-btn时执行代码，由于某种原因它没有检测到那里的点击，我'我试过了.live并没有用。可能有什么不对？感谢

<div class="map">
    <div class="game-step1">
        <div class="note">
            <h5>Day 5</h5>
            <p>Today is the 5th day of our trip around the world... We have already visited Rome, Istambul, Kenya and Maldives.<br/><br/>
<strong>Ready to guess what will be our next destination?</strong></p>
         </div>
         <img src="img/route1.png"  class="route route1"/>
         <a href="#" class="game-button start-btn" >Start the Game &raquo;</a>   
     </div>
</div>




 function showReadyMsg() {
            $('.game-step1').animate({left:'-886px'}, 500);
            console.log('showReadyMsg called')
        }

        $(".start-btn").live("click", function(){
            console.log('button clicked')
            showReadyMsg();
        });

Answer 1

Live不推荐使用早于jQuery1.9的版本，并在jQuery 1.9中删除。使用.start-button

在任何动态创建的元素上使用委托文档

试试这个

$(document).on('click','.start-btn',function(){
     //Code here
});

Answer 2

要对通过AJAX加载的项目执行的任何JavaScript / jQuery操作都需要在回调函数中设置，否则将无法看到。

$('#LoadingDiv').load('some.php #file',function(){
    // javascript to be done on the #file stuff you loaded
});

这是一个非常通用的例子。如果您没有任何参数传递给回调函数，您甚至可以使用您已经创建的函数的名称而不是显式声明。

$('#LoadingDiv').load('some.php #file',jsFunctionToCall);

要么应该工作。

.click函数不能处理使用Ajax加载的代码

2 个答案: