将三个js正文作为部分视图(通过iframe)放入asp net mvc中



I use asp net mvc.我有一个视图,在其中我调用(通过 ajax(控制器方法,该方法返回带有三个 js 渲染的部分视图。这个部分视图放在视图(iframe标签((以及三个js官方网站上的示例(。但是在 ajax 的成功事件中,我有空数据。请帮助解决此问题。主页的这一部分:

<div class="col-sm-8 col-md-9 pt-3" style="height:100%;">
                    <iframe id="viewer" name="viewer" >
                    </iframe>
            </div>

部分视图的以下代码:

<html lang="en">
    <head>
        <script src="../../Scripts/jquery-1.9.1.js" type="text/javascript"></script>
        <script src="../../Scripts/visualize/three.js" type="text/javascript"></script>
            <script src="../../Scripts/visualize/Detector.js" type="text/javascript"></script>
        <script>
            var WIDTH = 320,
            HEIGHT = 200;
            var renderer, scene, camera, cube;
            function onLoad() {
                var container = document.getElementById("container");
                renderer = new THREE.WebGLRenderer();
                renderer.setSize(WIDTH, HEIGHT);
                container.appendChild(renderer.domElement);
                camera = new THREE.PerspectiveCamera(45, WIDTH / HEIGHT, 0.1, 1000);
                scene = new THREE.Scene();
                scene.add(camera);
                camera.position.z = 300;
                cube = new THREE.Mesh(new THREE.CubeGeometry(200, 200, 200));
                cube.position.y = 0;
                cube.position.z = -150;
                scene.add(cube);
                requestAnimationFrame(render);
            };
            function render() {
                requestAnimationFrame(render);
                cube.rotation.y += 0.01;
                renderer.render(scene, camera);
            };
        </script>
    </head>
<body onload="onLoad();">
    <div id="container" style="border:1px solid black;width:320px;height:240px;"></div>
</body>

调用控制方法并将部分视图放在div 中的代码 id=viewer:

$("#btncalc").click(function () {
                $.ajax({
                    url: '@Url.Action("PartialPack", "Home")',
                    success: function (data) {
                        console.log(data);
                        $('#viewer').html(data);
                    },
                    error: function (data) {
                        console.log(data);
                    }
                });
            });

控制器方法的以下代码:

public PartialViewResult PartialPack()
        {
            ViewBag.allShapes = db.Shapes.ToList();
            return PartialView("PartialPack", db.Shapes.ToList());
        }

代码控制台.log(data(; 返回完整的部分视图代码,但是当我看到 #viewer 元素的代码时,它只包含以下内容:

<html>
<head></head>
<body></body>
</html>
你必须

用以下命令设置iframe的内容:

     $('viewer').contents().find('html').html('<html><head></head><body>test</body></hmtl>')

在您的情况下:

   success: function (data) {
           console.log(data);
            $('#viewer').contents().find('html').html(data);
    },

最新更新