Jquery图片加载函数
// Called when image is dropped in canvas
function dropResource() {
var imgIndex = getImageIndexByID(currentDragImageID);
var newImgID = resourceData.length;
var newImage;
newImage = $('<div id="imgD' + newImgID + '" style="display:inline-block;position:absolute;"><img alt="Big" id="imgA' + newImgID + '" src="' + uploadFolder + '/' + imgData[imgIndex][1] + '" /></div>');
$('#thePage').append(newImage);
$('imgA' + newImgID).load(function() {
// Get properties
var imgW = $('#imgA' + newImgID).width(); // Native width store this
var imgH = $('#imgA' + newImgID).height(); // Native
var imgX = $('#imgA' + newImgID).position().left; // Relative, scale back
var imgY = $('#imgA' + newImgID).position().top;
var zindex = getBiggestZindex() + 1;
// Resize native dimensions to fit current scale
$('#imgA' + newImgID).width(Math.round(imgW * currentScale));
$('#imgA' + newImgID).height(Math.round(imgH * currentScale));
$('#imgA' + newImgID).css("z-index", zindex);
// Add to array (dbID, imgarrIndex, width, height, x, y)
resourceData[newImgID] = new Array(0, imgIndex, imgW, imgH, imgX, imgY, zindex);
// Make img wrapper draggable
makeResourceDrag(newImgID);
// Save this as a resource
$.ajax({
url: 'artworkAjaxHandler.ashx?type=addResource&uploadID=' + currentDragImageID + '&page=' + currentPage + '&w=' + imgW + '&h=' + imgH + '&x=' + imgX + '&y=' + imgY + '&z=' + zindex,
success: function(data) {
var splitData = data.toString().split("|");
// Success
if (splitData[0] == "1") {
} else {
$.fancybox.close();
$.jGrowl("<strong>Error during image drop! Try reloading page.</strong><br />" + splitData[1], { sticky: true });
}
},
error: function() {
$.jGrowl("<strong>Error</strong><br />There was an error when processing the Ajax request", { sticky: true });
}
});
});
加载函数永远不会调用...我知道我可能执行不正确,但是一旦图像加载完成,它就会自动调整其包装器的大小然后我需要抓取尺寸。
有人可以帮忙吗?
// Called when image is dropped in canvas
function dropResource() {
var imgIndex = getImageIndexByID(currentDragImageID);
var newImgID = resourceData.length;
var newImage;
newImage = $('<div id="imgD' + newImgID + '" style="display:inline-block;position:absolute;"><img alt="Big" id="imgA' + newImgID + '" src="' + uploadFolder + '/' + imgData[imgIndex][1] + '" /></div>');
$('#thePage').append(newImage);
$('imgA' + newImgID).load(function() {
// Get properties
var imgW = $('#imgA' + newImgID).width(); // Native width store this
var imgH = $('#imgA' + newImgID).height(); // Native
var imgX = $('#imgA' + newImgID).position().left; // Relative, scale back
var imgY = $('#imgA' + newImgID).position().top;
var zindex = getBiggestZindex() + 1;
// Resize native dimensions to fit current scale
$('#imgA' + newImgID).width(Math.round(imgW * currentScale));
$('#imgA' + newImgID).height(Math.round(imgH * currentScale));
$('#imgA' + newImgID).css("z-index", zindex);
// Add to array (dbID, imgarrIndex, width, height, x, y)
resourceData[newImgID] = new Array(0, imgIndex, imgW, imgH, imgX, imgY, zindex);
// Make img wrapper draggable
makeResourceDrag(newImgID);
// Save this as a resource
$.ajax({
url: 'artworkAjaxHandler.ashx?type=addResource&uploadID=' + currentDragImageID + '&page=' + currentPage + '&w=' + imgW + '&h=' + imgH + '&x=' + imgX + '&y=' + imgY + '&z=' + zindex,
success: function(data) {
var splitData = data.toString().split("|");
// Success
if (splitData[0] == "1") {
} else {
$.fancybox.close();
$.jGrowl("<strong>Error during image drop! Try reloading page.</strong><br />" + splitData[1], { sticky: true });
}
},
error: function() {
$.jGrowl("<strong>Error</strong><br />There was an error when processing the Ajax request", { sticky: true });
}
});
});
The load function is never calling... I know i'm probably executing this improperly, but once the image has finished loading it resizes it's wrapper automatically then I need to grab the dimensions.
Can anyone help?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您缺少哈希:
应该
You are missing a hash:
should be