2017-08-19 18 views
0

私は動的idとurをajax呼び出しに渡したいと思います。私は基本的なdiv構造を作成し、同じurlから同じ構造体にデータをロードしたいと思っています。同じ構造を持ち、異なるデータとidを持つ複数のdivが表示されるようにdivを複製したいとします。そのコードは残念ですが、同じdiv内の別のURLのデータを表示していて、他のdivが空のデータを表示しています。コードスニペットをアップロードしていますが、静的IDのみを提供できます。動的idとurlをajax呼び出しに渡す

$(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.Can誰かにObjectオブジェクトを示しているしています。

+0

あなたはajaxで何も送信しません。 –

+0

しかし、何も送っていない場合、どうすればコンソールのデータを見ることができますか? –

+0

あなたは 'str'をidとして渡しています。これはオブジェクトです。代わりに 'i'だけを渡したいと思うかもしれません(私はあなたがidを何に使いたいか分かりません)。 –

答えて

0

私の推測、あなたはstrの[I]を実行するときに、内部だけ2オブジェクトを持っているので、それは最初の2反復のために動作しますtotalSpheres &その値を使用してループを反復する5.

var totalSpheres = 5; 

されしようとしていますstr。

をご確認ください。

+0

私はそれを取得しますが、2回の反復は単なる例であり、問​​題ではありません。 –

関連する問題