2013-08-21 11 views
0

我正在學習PHP和jQuery。我有一個名爲renderPicture.php的PHP文件,它在HTML IMG標籤中返回一個動態創建的圖像。我想在我的網頁上發生點擊事件後更改該圖片 - 無需重新加載頁面。我知道我需要一個jQuery Ajax調用renderPicture。而且我知道我需要將div的內部HTML設置爲該jQuery Ajax調用的結果。我學會了如何在這裏設置內部HTML How to replace innerHTML of a div using jQuery?但我不太清楚如何通過AJAX調用來完成此操作。如何使用jQuery將DIV的內部HTML更改爲PHP文件的輸出

如何使用jQuery將DIV的內部HTML設置爲PHP文件的輸出?

這裏是jQuery和一些HTML的:

<script> 

$(document).ready(function(){ 
    $("#myDIV").click(function(){ 
     //var resultOfAjaxCall = $.ajax({ url: './renderPicture.php',}); 
     $("#myDIV").html(resultOfAjaxCall); //This is roughly what I want to do 
    }); 
}); 

</script> 

</head> 
<div id='myDIV'> 
<?php 
$cryptinstall="./renderPicture.php"; 
include $cryptinstall; 
?> 
</div> 
</html> 

這裏是renderpicture.php

<?php 

$cryptinstall="./cryptographp.fct.php"; 
include $cryptinstall; 
if(session_id() == "") session_start(); 
$_SESSION['cryptdir']= dirname($cryptinstall); 
$cfg=0; 
echo "<img id='cryptogram' src='".$_SESSION['cryptdir']."/cryptographp.php?cfg=".$cfg."&".SID."'>"; 
ren 
?> 

回答

3

使用​​:

$(document).ready(function(){ 
    $("#myDIV").click(function(){ 
     $("#myDIV").load('renderPicture.php'); 
    }); 
}); 

這是簡寫:

$(document).ready(function(){ 
    $("#myDIV").click(function(){ 
     $.ajax({ 
      url: './renderPicture.php', 
      success: function(resultOfAjaxCall) { 
       $("#myDIV").html(resultOfAjaxCall); 
      } 
     }); 
    }); 
}); 

無論何時您想對AJAX調用的結果做些什麼,您都必須在回調函數中執行此操作。

+0

謝謝。它做到了 – bernie2436

0

如果我猜測正確,你需要從服務器load()

負載數據和返回的HTML放入匹配元素。

$("#myDIV").load('qualifiedFilePath'); 
0

使用jQuery.get(),使Ajax請求。

$.get('ajax/test.html', function(data) { 
    $('#myDIV').html(data); 
    alert('Load was performed.'); 
}); 
相關問題