我有一个拖放功能，在本地主机期间显示图像似乎很好，但是当我在托管站点中尝试它时，就会出现问题。它似乎image corrupt or truncated也在萤火虫中发出这个错误，但是当我下载它并在本地主机中再次尝试时，它似乎很好。知道问题可能是什么吗？
<?php
session_start();
?>
<?php
require "menu.php";
?>
<!DOCTYPE HTML>
<html>
<title>imageload</title>
<head>
<style type="text/css">
#div1 {width:255px;height:285px;border:1px solid #aaaaaa;z-index:1;}
</style>
<script>
function dress()
{
document.getElementById("shirt1").style.visibility = "visible";
document.getElementById("shirt2").style.visibility = "visible";
document.getElementById("shirt3").style.visibility = "visible";
}
function braces()
{
document.getElementById("brace1").style.visibility = "visible";
document.getElementById("brace2").style.visibility = "visible";
document.getElementById("brace3").style.visibility = "visible";
}
function shoes()
{
document.getElementById("shoe1").style.visibility = "visible";
document.getElementById("shoe2").style.visibility = "visible";
document.getElementById("shoe3").style.visibility = "visible";
}
var x = "waa";
var y = "waa";
var z = "waa";
var shoe = "waa";
var shirt = "waa";
var brace = "waa";
function AddCart()
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("DivAddDrag").innerHTML=xmlhttp.responseText;
}
}
var formData = new FormData();
var q1 = document.getElementById("quantity1").value;
var q2 = document.getElementById("quantity2").value;
var q3 = document.getElementById("quantity3").value;
formData.append("shoe", shoe);
formData.append("shirt", shirt);
formData.append("brace", brace);
formData.append("q1", q1);
formData.append("q2", q2);
formData.append("q3", q3);
xmlhttp.open("POST","adddrag.php");
xmlhttp.send(formData);
}
function allowDrop(ev)
{
if(x=="shirt1" || x == "shirt2" || x =="shirt3")
{
document.getElementById(x).style.visibility = "hidden";
}
if(x=="shirt1" && y=="waa" && z=="waa")
{
// is this what you are referring to?
document.getElementById('image').src = "dragged/d1.jpg";
}
if(x=="shirt2" && y=="waa" && z=="waa")
{
document.getElementById('image').src = "dragged/d2.jpg";
}
if(x=="shirt3" && y=="waa" && z=="waa")
{
document.getElementById('image').src = "dragged/d3.jpg";
}
if(y=="brace1" || y == "brace2" || y =="brace3")
{
document.getElementById(y).style.visibility = "hidden";
}
if(z=="shoe1" || z == "shoe2" || z =="shoe3")
{
document.getElementById(z).style.visibility = "hidden";
}
if(x=="shirt1")
{
shirt = "upload/d1.jpg";
}
if(x=="shirt2")
{
shirt = "upload/d2.jpg";
}
if(x=="shirt3")
{
shirt = "upload/d3.jpg";
}
if(y=="brace1")
{
brace = "upload/b1.jpg";
}
if(y=="brace2")
{
brace = "upload/b2.jpg";
}
if(y=="brace3")
{
brace = "upload/b3.jpg";
}
if(z=="shoe1")
{
shoe = "upload/s1.jpg";
}
if(z=="shoe2")
{
shoe = "upload/s2.jpg";
}
if(z=="shoe3")
{
shoe = "upload/s3.jpg";
}
ev.preventDefault();
}
function drag(ev)
{
if(ev.target.id == "shirt1" || ev.target.id == "shirt2" || ev.target.id == "shirt3")
{
x = ev.target.id;
}
if(ev.target.id == "brace1" || ev.target.id == "brace2" || ev.target.id == "brace3")
{
y = ev.target.id;
}
if(ev.target.id == "shoe1" || ev.target.id == "shoe2" || ev.target.id == "shoe3")
{
z = ev.target.id;
}
ev.dataTransfer.setData("Text",ev.target.id);
}
function drop(ev)
{
ev.preventDefault();
var data=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(data));
}
</script>
</head>
<body>
<?php
require "header.php";
?>
<div id = "wrapper" style="background-color:white; width:1013px; margin-left: auto;margin-right: auto;height:auto;z-index:1100;" >
<?php
if ($_SESSION['users_userName'] == "user")
{
?>
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)" style="position:relative;top:120px;left:730px;border: 5px solid #032472;height:500px;">
<img id ="image" src = "draggable/d1.jpg" style = "height:500px;width:255px;position:relative;bottom:30px;"/></div>
<?php
echo '<div style = "position:relative;left:50px;bottom:400px;">';
$sql = "select * from draggable Limit 6,3";
$data = mysql_query($sql,$con);
$y = 1;
while($row = mysql_fetch_array($data))
{
$id="shirt".$y;
echo '<img src="'.$row['Drag'].'" id = "'.$id.'" name="shirt" width="85px" height="85px" draggable="true" ondragstart="drag(event)" onClick="next()" style = "visibility:hidden;"/>';
$y=$y+1;
}
echo '<label> Quantity : </label>';
echo '<input type = "text" id = "quantity1" />';
echo '</br>';
$sql = "select * from draggable Limit 3";
$data = mysql_query($sql,$con);
$y = 1;
while($row = mysql_fetch_array($data))
{
$id="brace".$y;
echo '<img src="'.$row['Drag'].'" id = "'.$id.'" name="brace" width="85px" height="85px" draggable="true" ondragstart="drag(event)" onClick="next()" style = "visibility:hidden;"/>';
$y=$y+1;
}
echo '<label> Quantity : </label>';
echo '<input type = "text" id = "quantity2" />';
echo'</br>';
$sql = "select * from draggable Limit 3,3";
$data = mysql_query($sql,$con);
$y = 1;
while($row = mysql_fetch_array($data))
{
$id="shoe".$y;
echo '<img src="'.$row['Drag'].'" id = "'.$id.'" name="shoe" width="85px" height="85px" draggable="true" ondragstart="drag(event)" onClick="next()" style = "visibility:hidden;"/>';
$y=$y+1;
}
echo '<label> Quantity : </label>';
echo '<input type = "text" id = "quantity3" />';
echo'</br>';
echo '</div>';
?>
<button style = "position:relative;bottom:250px;left:30px;" onClick="AddCart()"> Add to Cart</button>
<div style ="position:relative;left:150px;bottom:750px;z-index:1300;">
<button id = "dressclick" onclick = "dress()"> Dress </button>
<button id = "shoeclick" onclick = "shoes()"> Shoes </button>
<button id = "braceclick" onclick = "braces()"> Bracelet </button>
</div>
<div id ="DivAddDrag" style ="position:relative;height:200px;width:500px;left:150px;bottom:400px;border:3px solid black"></div>
<?php
}
?>
<div class="push4">
</div>
</div>
<div id="footer4" style="margin-left:auto;margin-right:auto;width:1013px;"><?php require "footer.php";?></div>
</body>
</html>