Question

我使用jQuery .load函数将模板加载到容器中：

 $('#container').load('templates/list.php');

但是当它加载时，不能使用任何其他jQuery函数。例如，我加载模板：

<a href="#/phone" class="btn btn-primary btn-xs" id="phone_req">OK</a></div>

并添加到我的script.js

$('#phone_req').click(function(){
  console.log('Phone');
});

加载后，我点击按钮，但没有任何事情发生。请告诉我我哪里错了

Answer 1

您需要使用.on()并将事件监听器添加到<a>标记的父元素。

做这样的事情：

$('#container').on('click','a.btn',function(e){
    //do something...
});

在此处Event binding on dynamically created elements?和jQuery docs .on()

了解更多资讯

Answer 2

兄弟，你可以试试这个

＆＃13;

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>

<style type="text/css">
    body{
		margin:0;
		padding:0;
		overflow-x:hidden;
	}
	
	#container{
		width:300px;
		height:200px;
		border:1px solid;
	}
</style>

</head>

<body>

    <div id="container"></div>
    
    <a href="#/phone" class="btn btn-primary btn-xs" id="phone_req">OK</a></div>
    
    <script>
	    $('#container').load('list.php');
		$('#phone_req').click(function(){
            console.log('Phone');
			
        });
	</script>


</body>
</html>

＆＃13;

加载模板jQuery后，脚本不起作用

2 个答案: