下午好，
所以我有一个页面，其中circle.png图像被移动使用JS圈出我指定的某些固定点。这是代码：
<script language='JavaScript' type='text/JavaScript'>
<!--
function move_img(str) {
switch(str){
case "ss":
document.getElementById('dwr_style').style.left=118 + "px";
document.getElementById('dwr_style2').style.left=118 + "px";
document.getElementById('dwr_style2').style.top=1410 + "px";
break;
case "rout":
document.getElementById('dwr_style').style.left=180 + "px";
document.getElementById('dwr_style2').style.left=180 + "px";
document.getElementById('dwr_style2').style.top=1410 + "px";
break;
case "fp":
document.getElementById('dwr_style').style.left=240 + "px";
document.getElementById('dwr_style2').style.left=240 + "px";
document.getElementById('dwr_style2').style.top=1410 + "px";
break;
case "dt_std":
document.getElementById('dt').style.left=390 + "px";
document.getElementById('dt2').style.left=390 + "px";
document.getElementById('dt2').style.top=1678 + "px";
document.getElementById('dt').style.width=70 + "px";
document.getElementById('dt2').style.width=70 + "px";
break;
case "dt_34":
document.getElementById('dt').style.left=465 + "px";
document.getElementById('dt').style.width=40 + "px";
document.getElementById('dt2').style.left=465 + "px";
document.getElementById('dt2').style.width=40 + "px";
document.getElementById('dt2').style.top=1678 + "px";
break;
case "dt_1":
document.getElementById('dt').style.left=505 + "px";
document.getElementById('dt').style.width=40 + "px";
document.getElementById('dt2').style.left=505 + "px";
document.getElementById('dt2').style.width=40 + "px";
document.getElementById('dt2').style.top=1678 + "px";
break;
}
}
//-->
</script>
</head>
<body>
<img src="CalDoor.jpg">
<div style="position:absolute;top:30;left:590;">1</div>
<input type=text style="position:absolute;border:none;top:185;left:100;" placeholder="Enter Job Name">
<?php
$file = $_FILES['uploaded_file']['tmp_name'];
$file2 = nl2br(file_get_contents($file));
$file3 = str_replace('"' , '' , $file2);
$file4 = str_replace('ÿþ' , '' , $file3);
$line_break = explode("<br />" , $file4);
$topchange=105;
$count = 0;
foreach ($line_break as $final1) {
$final2 = explode(";" , $final1);
$regex = '#\((([^()]+|(?R))*)\)#';
preg_match($regex, $final1, $match);
$type = "S";
if ($final2[4] == "DF") {
$type = "DF";
}
if ($final2[6] == "Glass") {
$type = "GL";
}
if ($count == 24) {
$topchange = 1097;
$pagecount = 2;
echo '<img src="CalDoor.jpg" style="position:absolute;top:1000;left:8;">';
echo '<div style="position:absolute;top:1022;left:590;">2</div>';
echo '<div style="position:absolute;top:1022;left:640;">'. $pagecount .'</div>';
echo "<img src='circle.png' id='fds' style='position:absolute;Top:1297;Left:20;' width=80 height=25>";
echo "<img src='circle.png' id='dwr_style2' style='position:absolute;Top:1410;Left:118;' width=70 height=30>";
echo "<img src='circle.png' id='dt2' style='position:absolute;Top:1678;Left:392;' width=70 height=30>";
}
echo "<div style='position:absolute;TOP:". $topchange .";LEFT:395;'>". $final2[1] ."</div>";
echo "<div style='position:absolute;TOP:". $topchange .";LEFT:450;'>". $final2[3] ."</div>";
echo "<div style='position:absolute;TOP:". $topchange .";LEFT:365;'>". $match[0] ."</div>";
echo "<div style='position:absolute;TOP:". $topchange .";LEFT:335;'>". $type ."</div>";
echo "<div style='position:absolute;TOP:". $topchange .";LEFT:532;'>". $final2[6] ."</div>";
$changeamt = 24.2;
$topchange = $topchange + $changeamt;
$count++;
}
echo '<div style="position:absolute;top:30;left:640;">';
echo $pagecount;
echo '</div>';
?>
<img src='circle.png' id='fds' style='position:absolute;Top:305;Left:20;' width=80 height=25>
<img src='circle.png' id='dwr_style' style='position:absolute;Top:420;Left:118;' width=70 height=30>
<img src='circle.png' id='dt' style='position:absolute;Top:685;Left:392;' width=70 height=30>
<div class='no-print' style='position:absolute;TOP:50;LEFT:900;'>
<b>Drawer Type: </b><br>
<input type=button onClick=move_img('ss') value='Solid Stock'>
<br>
<input type=button onClick=move_img('rout') value='Routed'>
<br>
<input type=button onClick=move_img('fp') value='Five Piece'>
<br><br>
</div>
<div class='no-print' style='position:absolute;TOP:158;LEFT:900;'>
<b>Door Thickness: </b><br>
<input type=button onClick=move_img('dt_std') value='Std 13/16"'>
<br>
<input type=button onClick=move_img('dt_34') value='3/4"'>
<br>
<input type=button onClick=move_img('dt_1') value='1"'>
<br><br>
</div>
这些圈子是绝对的，因为我将它们投射到我的CalDoor图像上。当我的文件过来并有超过24行数据时，我让它在下面投射第二个CalDoor图像，并添加相应的圆圈以匹配鞋面。唯一的问题是，当我去打印时，它会像我想要的那样在2个单独的页面上显示CalDoor图像，第二页上的圆圈保留其水平位置，但不保留它们的垂直位置。任何原因？
感谢。