什麼，我試圖做一個位：Maphilight插件的jQuery無效指針問題與動態加載圖像
在在window.onload這一頁將AJAX調用另一個PHP頁面，並得到一個base64編碼的圖像作爲響應。這工作正常。一旦圖像通過AJAX返回，它將被設置爲'img1'的src。另外，工作很好。由於maphilight，該圖片還有一個區域地圖，座標也被拉動並被設置爲相同的AJAX調用。在這裏，maphilight不會開始工作，當然，Internet Explorer。我已經在所有其他瀏覽器上測試過它，並且突出顯示工作正常。我的問題是如何獲得在Internet Explorer上工作的亮點。我在這裏搜索了幾天，並且嘗試了一些有趣的事情：首先嚐試調用加載事件，在頁面加載後追加.js文件，檢查圖像加載，然後運行jquery插件，全部徒勞無功。
wrap = $('<div></div>').css({
display:'block',
background: 'url("' + this.src + '")',
position:'relative',
padding:0,
width:this.width,
height:this.height
});
的img.src是空白的，直到在window.onload函數被調用和AJAX調用：當代碼工作最好的，我在maphilight插件，它包含以下行獲得的無效指針錯誤是爲了檢索base64圖像。這裏是調用的函數，以及如何顯示到頁面：
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="jquery.maphilight.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$.fn.maphilight.defaults = {
fill: true,
fillColor: 'ffffff',
fillOpacity: 0.5,
stroke: true,
strokeColor: '0055bb',
strokeOpacity: 1,
strokeWidth: 1,
fade: true,
alwaysOn: false,
neverOn: false,
groupBy: false,
wrapClass: true,
shadow: false,
shadowX: 0,
shadowY: 0,
shadowRadius: 6,
shadowColor: '000000',
shadowOpacity: 0.8,
shadowPosition: 'outside',
shadowFrom: false
}
$('img[usemap]').maphilight();
});
window.onload = function(){
ajaxFunction();
}
var ttxx = new Array();
function ajaxFunction(){
var ajaxRequest; // Start Ajax Request
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject('Msxml2.XMLHTTP');
} catch (e) {
try{
ajaxRequest = new ActiveXObject('Microsoft.XMLHTTP');
} catch (e){
// Something went wrong
alert('Your browser broke!');
return false;
}
}
}
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var resp = ajaxRequest.responseText;
var spl = resp.split('SECIMG'); // response received divide it up to get all vars
thei = spl[0]; // get img src1 (img to be hilighted)
var rest = spl[1]; // get rest of request
var im = document.getElementById('img1');// set var for img name
im.src = thei; // set img1 src as base64 code recived
var spl3 = rest.split('eb');
var tx = spl3[0]; // get txt values
var coor = spl3[1]; // get coordinates
var ttx = tx.split(':');
for (u = 0; u< 8; u++){
var ne = u + 1;
ttxx[ne] = ttx[u];
}
var mid = '100,100'; // set coordinates
var indiv = coor.split('ec');
for (i = 0; i< 8; i++){
var coord = indiv[i];
var fullcoor = coord + ',' + mid;
var upone = i + 1;
var are = document.getElementById('ar' + upone);
are.coords = fullcoor; //coordinates set
}
}
}
ajaxRequest.open('GET', 'testajaximg.php', true);
ajaxRequest.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
ajaxRequest.setRequestHeader('Authorization', 'GetCap');
ajaxRequest.send(null);
} // obviously set AJAX request
</script></head>
有跡象表明，我將不包括由於空間和時間的限制，但這些都做工精細等功能。 （即點擊地圖區域，併發出警報）
下面是其中圖像（在php）中顯示的頁面的主體部分的HTML代碼：
<img id="img1" border="0" usemap="#cap"><br><br> /*img put here */
<map name="cap">";
$huy = 1;
$enlop = 8;
while ($huy <= $enlop){
echo"<area shape="polygon" id="ar".$huy."\" coords="" onclick=javascript:alert('Hello'".$huy."');">";
$huy++;
}
echo"</map>";
我知道圖像是因爲它被顯示而設置，並且我知道設置了座標和區域，因爲警報是根據您點擊圖像的位置而拋出的。加載圖片過早，無法通過javascript加載，或者JavaScript是加載原始圖片src而不是新圖片？任何幫助將真正被讚賞。再次
http://www.securacap.com/testajax2.php
感謝能夠在這種情況下被有何啓示：你可以在我的網站上看到這裏的代碼的真人版。我寧願不使用像插入圖像一樣的插件，因爲我已經有太多的插件和腳本了！儘量保持它儘可能簡單。
除了我試圖讓它工作的東西之外，我試着改變jquery插件的'this.src'部分，這個部分是將錯誤生成到空白處。這導致錯誤消失，但圖像一旦加載就會消失，只顯示hilight。此外，嘗試把一個靜態圖像源如「test.gif」。這使得它工作沒有錯誤，但我想要一種方式來顯示動態圖像。再次感謝您的幫助。 –
哦，它也似乎在IE8中工作正常，而不是IE6，所以這就是我正在嘗試修復。 –