HTML5代码未在JSP文件中运行

本文介绍了HTML5代码未在JSP文件中运行的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试在HTML5画布中拖放一个对象。当我从桌面运行代码作为.html文件时，它在我的浏览器中运行完美。当我在.jsp文件中运行完全相同的代码时，我没有输出..在我的Web浏览器中显示jsp文件中的输出我使用JDeveloper 11.1.1.7.0作为IDE和Oracle weblogic服务器作为应用服务器。这个版本的IDE支持HTML5 ??

I'm trying to drag and drop an object in HTML5 canvas. When i run the code as a .html file from my desktop, it runs perfectly in my browser. When i run the exact same code in a .jsp file then i get no output..To display the output in my web browser from the jsp file I'm using JDeveloper 11.1.1.7.0 as the IDE and Oracle weblogic server as the application server.Does this version of IDE support HTML5??

我得到的另一个错误是不期望元素画布

Another error i'm getting is "Element canvas not expected"

请帮助..

.jsp文件中的代码

Code in .jsp file

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
 <%@ page contentType="text/html;charset=UTF-8"%>
 <html>
 <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>floorplan</title>
<script type="javascript">

var canvas;
var ctx;
var x = 75;
var y = 50;
var WIDTH = 400;
var HEIGHT = 300;
var dragok = false;

function rect(x,y,w,h) {
ctx.beginPath();
ctx.rect(x,y,w,h);
ctx.closePath();
ctx.fill();
}

function clear() {
ctx.clearRect(0, 0, WIDTH, HEIGHT);
}

function init() {
canvas = document.getElementById("canvas");
ctx = canvas.getContext("2d");
return setInterval(draw, 10);
}
function draw() {
clear();
ctx.fillStyle = "#FAF7F8";
rect(0, 0, WIDTH, HEIGHT);
ctx.fillStyle = "#444444";
rect(x - 15, y - 15, 30, 30);
}

 function myMove(e) {
if (dragok) {
    x = e.pageX - canvas.offsetLeft;
    y = e.pageY - canvas.offsetTop;
}
}

  function myDown(e) {
   if (e.pageX < x + 15 + canvas.offsetLeft && e.pageX > x - 15 + canvas.offsetLeft && e.pageY < y + 15 + canvas.offsetTop && e.pageY > y - 15 + canvas.offsetTop) {
    x = e.pageX - canvas.offsetLeft;
    y = e.pageY - canvas.offsetTop;
    dragok = true;
    canvas.onmousemove = myMove;
  }
 }

 function myUp() {
 dragok = false;
canvas.onmousemove = null;
}

 init();
 canvas.onmousedown = myDown;
 canvas.onmouseup = myUp;
 </script>
    </head>
    <body>
        <div>
             <canvas id="canvas" width="400" height="300">This text is displayed if your browser does not support HTML5 Canvas.</canvas>
         </div>
     </body>
 </html>

HTML5

HTML5代码未在JSP文件中运行

问题描述

推荐答案