<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無標題文檔</title> <style> .special_color{ font-size:16px; color:#006633; font-family:"微軟雅黑"; } </style> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script> </head> <body> <div class="search_sort"> <li><a href="#" class="special_color">全部</a></li> <li><a href="#">前沿技術</a></li> <a href="#">原創</a> <a href="javascript:void(0);" onclick="js_clear()" >翻唱</a> <a href="javascript:void(0);" onclick="js_clear()" >kkk</a> </div> <div class="classify"> </div> <script type="text/jscript"> $(function(){ var tit = ''; getClassify(""); // $('.search_sort li a').click(function(){ // alert($(this).text());//輸出所點的a的內容 // tit = $(this).text(); // alert(tit); // getClassify(tit); // }) // 獲取ajax中動態 點擊的a標簽的值 $(".classify").on("click","li>a",function(){ alert("被點擊了"); alert($(this).text()) }) // $(".classifyyy a").on("click", function(){ // alert( $(this).text() ); // }); // $('.classifyyy li a').click(function(){ // alert($(this).text());//輸出所點的a的內容 // tit = $(this).text(); // alert(tit); // getClassify(tit); // }) }); function getClassify(tit){ $.ajax({ url:"http://localhost:8080/selectClassifyAllOrByDirectionid", data:"describee="+tit, success:function(Classify){ var li1 = '<li class="course-nav-item on"><a href="#">全部</a></li>'; var li2 =''; for (var i = 0 ; i < Classify.length ; i++) { li2 += '<li class="course-nav-item "><a href="#" data-id="6303" data-ct="tyscript">'+Classify[i].classifyname+'</a></li>'; } var li3 = li1 + li2 ; $(".classify").append(li3); } }); } </script> </body> </html>
2.$(document).on(‘click’,‘要選擇的元素’,function(){})
on方法包含很多事件,點擊,雙擊等等事件。和$().click()的用法一樣,最大的區別即優點是如果動態創建的元素在該選擇器選中范圍內是能觸發回調函數。