我不知道jquery怎么了？

Question

我不知道有什么問題可以幫助我嗎？ 當我嘗試將其加載到chrome上時，它只是白屏，並且代碼使用在其自己的文件中，這將是當我發現有什么問題時，它只是加載了白頁，我正在嘗試通過幫助使多維數據集加載從jquery和three.js

<!DOCTYPE HTML>
<html>
<head>
    <title>THREE</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script type="text/javascript" src="js/three.js"></script>

    <style>
        body{
            margins:0;
            overflow:hidden;
        }
    </style>
</head>

<body>

    <div id="container"></div>
    <script>
    $(document).ready(function(){}

        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, .1, 500);
        var renderer = new THREE.WebGLRenderer();

        renderer.setColor(0xdddddd);
        renderer.setSize(window.innerWidth, window.innerHeight);

        var axis = new THREE.AxisHelper(10);
        scene.add(axis);

        var grid = new THREE.GridHelper(50, 5);
        var color = new Color("rgb(255, 0, 0)");
        grid.setColors(color, 0x000000);

        //scene.add(grid);

        var cubeGeo = new THREE.BoxGeometry(5, 5, 5);
        var cubeMat = new THREE.MeshBasicMaterial({color:0xdddddd, wireframe:true});
        var cube = new THREE.Mesh(cubeGeo, cubeMat);


        cube.position.x = 0;
        cube.position.y = 0;
        cube.position.z = 0;
        scene.add(cube);

        camera.position.x = 40;
        camera.position.y = 40;
        camera.position.z = 40;

        camera.lookAt(scene.position);
        $("#container").append(renderer.domElement);
        renderer.render(scene,camera);
    });

    </script>

</body>

</html>

Answer 1

從此處卸下右括號：

    $(document).ready(function(){

刪除此行，setColor似乎不是THREE.WebGLRenderer的方法：

    renderer.setColor(0xdddddd);

更改：

     var color = new Color("rgb(255, 0, 0)");

至：

     var color = new THREE.Color("rgb(255, 0, 0)");

Answer 2

看來您立即打開和關閉了$(document).ready(function(){} 。因此需要刪除右括號$(document).ready(function(){}以便將整個腳本包含在其中並且在底部有適當的結束標記。我沒有three.js，但是我認為以下方法應該有效。

<!DOCTYPE HTML>
<html>
<head>
    <title>THREE</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script type="text/javascript" src="js/three.js"></script>

    <style>
        body{
            margins:0;
        }
    </style>
</head>

<body>

    <div id="container"></div>
    <script>
    $(document).ready(function(){

        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, .1, 500);
        var renderer = new THREE.WebGLRenderer();

        renderer.setColor(0xdddddd);
        renderer.setSize(window.innerWidth, window.innerHeight);

        var axis = new THREE.AxisHelper(10);
        scene.add(axis);

        var grid = new THREE.GridHelper(50, 5);
        var color = new Color("rgb(255, 0, 0)");
        grid.setColors(color, 0x000000);

        //scene.add(grid);

        var cubeGeo = new THREE.BoxGeometry(5, 5, 5);
        var cubeMat = new THREE.MeshBasicMaterial({color:0xdddddd, wireframe:true});
        var cube = new THREE.Mesh(cubeGeo, cubeMat);


        cube.position.x = 0;
        cube.position.y = 0;
        cube.position.z = 0;
        scene.add(cube);

        camera.position.x = 40;
        camera.position.y = 40;
        camera.position.z = 40;

        camera.lookAt(scene.position);
        $("#container").append(renderer.domElement);
        renderer.render(scene,camera);
    });

    </script>

</body>

</html>

我不知道jquery怎么了？

問題描述

2 個解決方案

解決方案1
1 已采納 2015-06-24 20:24:25

解決方案2
0 2015-06-24 20:23:27

我不知道jquery怎么了？

問題描述

2 個解決方案

解決方案1 1 已采納 2015-06-24 20:24:25

解決方案2 0 2015-06-24 20:23:27

解決方案1
1 已采納 2015-06-24 20:24:25

解決方案2
0 2015-06-24 20:23:27