訳あって既存のウェブページ(SPA)を使って、3つ並べた新しいウェブページ(SPA)を作ろうと検討しています(可能かどうかは判っていません)。
新しいSPAでは、以下のように既存のSPAを読み込む想定です(これしか方法が思い浮かびませんでした)。
まとめhtmlイメージ:
html
1<div id="system"> 2 <div id="panel1">Panel1 3 <script src="js/main.js?x=xpos1&y=ypos1"></script> 4 </div> 5 <div id="panel2">Panel2 6 <script src="js/main.js?x=xpos2&y=ypos2"></script> 7 </div> 8 <div id="panel3">Panel3 9 <script src="js/main.js?x=xpos3&y=ypos3"></script> 10 </div> 11</div>
この方法でなんとか各main.js(既存コード)では自分がどの部位を担当するのか知らせることができました。
しかし、この3つを監視して操作するコードで、各main.jsでインスタンスかされているオブジェクトを区別する方法がわかりません。
例えば、panel2のdiv内で呼び出したオブジェクトのgetX()を呼び出すにはどう書けばいいのでしょうか?そもそも呼び出すことはできるのでしょうか?
main.js:
javascript
1(function ($) { 2 'use struct'; 3 4 var pos = (function () 5 { 6 var scripts = document.getElementsByTagName( 'script' ); 7 var len = scripts.length; 8 console.log('scripts size: ' + len); 9 for (var i=0; i<len; i++) { 10 console.log(i + ": " + scripts[i].src); 11 } 12 var src = scripts[ scripts.length - 1 ].src; 13 var query = src.substring( src.indexOf( '?' ) + 1 ); 14 var parameters = query.split( '&' ); 15 var result = new Object(); 16 for( var i = 0; i < parameters.length; i++ ) 17 { 18 var element = parameters[ i ].split( '=' ); 19 var paramName = decodeURIComponent( element[ 0 ] ); 20 var paramValue = decodeURIComponent( element[ 1 ] ); 21 result[ paramName ] = paramValue; 22 } 23 return result; 24 })(); 25 26 var xpos = 0; 27 function getX() { 28 return xpos; 29 } 30 var ypos = 0; 31 function getY() { 32 return ypos; 33 } 34 35 $(function () { 36 setInterval(function() { 37 $('#'+pos.x).val(getX()); 38 $('#'+pos.y).val(getY()); 39 }, 1000); 40 41 setInterval(function() { 42 xpos = Math.random(); 43 ypos = Math.random(); 44 }, 3000); 45 }); 46}(jQuery)); 47
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2015/07/20 13:55