Question

我想将动态ID和ur传递给ajax调用。我创建了一个基本的div结构，并希望从不同的url加载相同结构中的数据，并且希望div用不同的id复制自身，这样就可以显示具有相同结构但不同数据和id的多个div。我写了一个代码，但不幸的是它显示来自同一div中不同网址的数据，其他div显示空数据。我上传了一个代码片段，但我只能提供静态ID。

$(function(){   
var camera, renderer;
var mpi=Math.PI /180;
var circleRadius = 1800;
var startAngle = 0;
var centerX = 0;
var centerZ = 0;
var startRadians = startAngle + mpi;
var totalSpheres = 5;
var incrementAngle = 360/totalSpheres;
var incrementRadians = incrementAngle * mpi;
var Element = function ( id, w, h, position, rotation ) {
                    var html = [
                            '<div class="wrapper" >',
                            '<ul class="stage clearfix">',
                            '<li class="scene" >',
                             '<div class="movie i1" id="' + id + '" >',


                             '</div>',
                             '</li>',



                             '</ul>',
                             '</div>'
                        ].join('\n');
                    var div = document.createElement('div');
                    $(div).html(html);


                    var object = new THREE.CSS3DObject( div );
                    object.position.x = position.x;
                    object.position.y = position.y;
                    object.position.z = position.z;
                    object.rotation.x = rotation.x;
                    object.rotation.y = rotation.y;
                    object.rotation.z = rotation.z;
                    return object;

                    }           
        init();
        function init() {
            scene = new THREE.Scene();
            var container = document.getElementById( 'container' );
            var renderer = new THREE.CSS3DRenderer();
            renderer.setSize(window.innerWidth, window.innerHeight*.85);
            container.appendChild( renderer.domElement );
            camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 10 );
            camera.position.set(-100,60,4000);
            var group = new THREE.Group();

            var str = {
                "0":"attacker",
                "1":"defender",

            }
            for ( var i = 0; i < totalSpheres; i ++ ) {
            $.ajax({
    dataType: "text",
    url: "http://localhost/liberate/threeee/PAGES/Information/content.html",
    success: function (data) {      
                console.log(data);
        $(str[i]).append(data)
    }});
            }

            for ( var i = 0; i < totalSpheres; i ++ ) {
                var xp = centerX + Math.sin(startRadians) * circleRadius;
                var zp = centerZ + Math.cos(startRadians) * circleRadius;
                group.add( new Element( str, 1000, 1000, new THREE.Vector3(xp, 0, zp), new THREE.Vector3(0, i*incrementAngle * (Math.PI/180.0), 0) ) );
                startRadians += incrementRadians;


              }
                scene.add(group);


            renderer.render( scene, camera );

        }

});

我尝试过动态id并尝试调试代码，但是它在id中显示了Object对象。有人给出了在这种情况下可以做什么的任何建议。

Answer 1

我的猜测，你正在尝试使用totalSpheres＆amp;它的值是5。

var totalSpheres = 5;

当你执行str [i]时，它将适用于前2次迭代，因为str中只有2个对象。

请检查。

将动态id和url传递给ajax调用

1 个答案: