jQuery獲取動態生成的元素
阿新 • • 發佈:2017-08-05
fun ast tails 生成 console ron sni 獲取 data
以上代碼非常easy,就是通過post從後臺返回的值加入到<table>中
此時再獲取的時候頁面已載入完數據。
需求描寫敘述:頁面上能夠動態加入數據,比方table,點擊按鈕能夠動態加入行。
又或頁面
載入時table數據是通過ajax從後臺獲取的。而這時我們想要獲取當中的某個值,又該怎樣獲取呢?假設是要通過某個事件來獲取的比方click,mouseover等等,則能夠使用live()方法
$(".button").live("click",function(){ console.info($("#mytd").html()); })live()的具體說明參考http://blog.csdn.net/itmyhome1990/article/details/17380665
而假設不是通過某個事件,當頁面載入的時候我們就要獲取值或進行其它操作
live()方法就不行了,由於我們無法傳入一個事件。
比方下面代碼:
<body> <table id="tab" border="1" width="30%"> </table> </body> <script type="text/javascript"> $(function() { $.post("admin/UserForumthemeBabygrowupFrontList.do",{},function(data){ console.info(data.table); $("#tab").append(data.table); }) alert($("#mytd").html()); //獲取值 }); </script>
後臺返回數據為 <tr><td id=‘mytd‘>北京</td><td>深圳</td></tr>而我們要在post之後獲取id為mytd的值,
此時是獲取不到的,我們從瀏覽器中就能夠觀察出問題:
從以上能夠看出在alert的時候 數據並還沒有載入出來 控制臺也並沒有打印出信息,所以此時是取不到數據的。
使用ajaxComplete()方法能夠在請求完畢時運行要運行的代碼,我們改動為例如以下:
$(function() { $.post("admin/UserForumthemeBabygrowupFrontList.do",{},function(data){ console.info(data.table); $("#tab").append(data.table); }) $("#tab").ajaxComplete(function(){ //待請求完畢時 運行 alert($("#mytd").html()); }) });
此時再獲取的時候頁面已載入完數據。
jQuery獲取動態生成的元素