2010-08-15 192 views
2

調用服務器並將數據返回到表中後,我使用jQuery的.html()語法將它插入到頁面中。之後,數據出現在頁面中,但我無法使用jQuery來操作它。無法操作從jQuery中的ajax請求插入的數據

繼承人的代碼:

<html> 
<head> 
    <title>testJavaScript</title> 

    <script type="text/javascript" src="jquery-1.4.2.js"></script> 

    <script type="text/javascript"> 

    function makeTable(data) { 

     var htmlOut = "<table id=\"AjaxTable\">"; 

     for (x in data) { 
      htmlOut += "<tr>"; 
      for (y in data[x]) { 
       htmlOut += "<td>"+data[x][y]+"</td>"; 
      } 
      htmlOut += "</tr>"; 
     } 

     htmlOut += "</table>"; 

     return htmlOut; 
    } 

    function getValue() { 
     return $("#MyText").val() 
    } 

    $(document).ready(function() { 

     $("img").hover(function() { //This dosent work on the data returned from the server 
      $(this).hide(1000) 
      //$(this).css({'background-color': '#357EC7', 'border': '2px solid #2B60DE'}); 
     }) 

     $("#populateDrop").click(function() { 
      $.getJSON('http://127.0.0.1:5000/ajaxTest/json?num='+ getValue() +'&callback=?', function(data) { 
       $(".result").html(makeTable(data.data)); 
      }) 

     }) 
    }) 
    </script> 
</head> 

<body> 
    <img src="http://www.sharejs.com/code/windows/light-window/gallery/1-nature.jpg" width="50" height="50" /></br> 
    <form> 
    <input id="MyText" type="text" value="15" /> 
    </form> 
    <a href="#" id="populateDrop">Populate!</a></br> 
    <div class="result"></div> 
</body> 

回答

0

您需要使用live而不是爲動態數據:

$("img").live('hover', function() { 
$(this).hide(1000); 
}); 

更多信息:

+0

很酷,感謝您的快速響應! – Joshkunz 2010-08-15 06:09:24

+0

@Joshkunz:不客氣:) – Sarfraz 2010-08-15 07:20:19