このjavascriptスニペットをもっと便利にするにはどうすればいいですか

Question

ドラッグアンドドロップで10個のオブジェクトをテストするためのコードを作成しましたが、ドラッグアンドドロップ可能なオブジェクトをいくつでも作成する必要があります...、メートルあなたのコードに基づいて

var oA = document.all ? document.all["a"] : document.getElementById("a") 
     var oB = document.all ? document.all["b"] : document.getElementById("b") 
     var oC = document.all ? document.all["c"] : document.getElementById("c") 
     var oD = document.all ? document.all["d"] : document.getElementById("d") 
     var oE = document.all ? document.all["e"] : document.getElementById("e") 
     var oF = document.all ? document.all["f"] : document.getElementById("f") 
     var oG = document.all ? document.all["g"] : document.getElementById("g") 
     var oH = document.all ? document.all["h"] : document.getElementById("h") 
     var oI = document.all ? document.all["i"] : document.getElementById("i") 
     var oJ = document.all ? document.all["j"] : document.getElementById("j") 

     var fA = document.all ? document.all["fA"] : document.getElementById("fA") 
     var fB = document.all ? document.all["fB"] : document.getElementById("fB") 
     var fC = document.all ? document.all["fC"] : document.getElementById("fC") 
     var fD = document.all ? document.all["fD"] : document.getElementById("fD") 
     var fE = document.all ? document.all["fE"] : document.getElementById("fE") 
     var fF = document.all ? document.all["fF"] : document.getElementById("fF") 
     var fG = document.all ? document.all["fG"] : document.getElementById("fG") 
     var fH = document.all ? document.all["fH"] : document.getElementById("fH") 
     var fI = document.all ? document.all["fI"] : document.getElementById("fI") 
     var fJ = document.all ? document.all["fJ"] : document.getElementById("fJ") 

     Drag.init(oA, null, 0, 278, 0, 278); 
     Drag.init(oB, null, 0, 278, 0, 278); 
     Drag.init(oC, null, 0, 278, 0, 278); 
     Drag.init(oD, null, 0, 278, 0, 278); 
     Drag.init(oE, null, 0, 278, 0, 278); 
     Drag.init(oF, null, 0, 278, 0, 278); 
     Drag.init(oG, null, 0, 278, 0, 278); 
     Drag.init(oH, null, 0, 278, 0, 278); 
     Drag.init(oI, null, 0, 278, 0, 278); 
     Drag.init(oJ, null, 0, 278, 0, 278); 

     oA.onDragEnd = function(x, y) { keepDragEnd(fA, fA1, "A", x, y); } 
     oB.onDragEnd = function(x, y) { keepDragEnd(fB, fB1, "B", x, y); } 
     oC.onDragEnd = function(x, y) { keepDragEnd(fC, fC1, "C", x, y); } 
     oD.onDragEnd = function(x, y) { keepDragEnd(fD, fD1, "D", x, y); } 
     oE.onDragEnd = function(x, y) { keepDragEnd(fE, fE1, "E", x, y); } 
     oF.onDragEnd = function(x, y) { keepDragEnd(fF, fF1, "F", x, y); } 
     oG.onDragEnd = function(x, y) { keepDragEnd(fG, fG1, "G", x, y); } 
     oH.onDragEnd = function(x, y) { keepDragEnd(fH, fH1, "H", x, y); } 
     oI.onDragEnd = function(x, y) { keepDragEnd(fI, fI1, "I", x, y); } 
     oJ.onDragEnd = function(x, y) { keepDragEnd(fJ, fJ1, "J", x, y); } 

     oA.onDrag = function(x, y) { keepDragEnd(fA, fA1, "A", x, y); } 
     oB.onDrag = function(x, y) { keepDragEnd(fB, fB1, "B", x, y); } 
     oC.onDrag = function(x, y) { keepDragEnd(fC, fC1, "C", x, y); } 
     oD.onDrag = function(x, y) { keepDragEnd(fD, fD1, "D", x, y); } 
     oE.onDrag = function(x, y) { keepDragEnd(fE, fE1, "E", x, y); } 
     oF.onDrag = function(x, y) { keepDragEnd(fF, fF1, "F", x, y); } 
     oG.onDrag = function(x, y) { keepDragEnd(fG, fG1, "G", x, y); } 
     oH.onDrag = function(x, y) { keepDragEnd(fH, fH1, "H", x, y); } 
     oI.onDrag = function(x, y) { keepDragEnd(fI, fI1, "I", x, y); } 
     oJ.onDrag = function(x, y) { keepDragEnd(fJ, fJ1, "J", x, y); } 

Answer 1

....動的にそれぞれドラッグ＆ドロップ可能オブジェクトを作成すると、すべての回でそれぞれのCOORDSをキャプチャする方法を探して、あなたが使用した文字列を保持するための3つの配列を使用して、それはこのようにリファクタリングすることができます

var arr1=["a","b","c","d","e","f","g","h","i","j"]; 
var arr2=["fA","fB","fC","fD","fE","fF","fG","fH","fI","fJ"]; 
var arr3=["A","B","C","D","E","F","G","H","I","J"]; 
var numobjects=10; 

for(i=0 to numobjects-1) 
{ 
    var o[i]=document.all?document.all[arr1[i]]:document.getElementById(arr1[i]); 
    var f[i]=document.all?document.all[arr2[i]]:document.getElementById(arr2[i]); 
    Drag.init(o[i], null, 0, 278, 0, 278); 
    o[i].onDragEnd=function(x, y) {keepDragEnd(f[i], f1[i], arr3[i], x, y);} 
    oA.onDrag=function(x, y) {keepDragEnd(f[i], f1[i], arr3[i], x, y);} 
} 

Answer 2

var arr_id = [/* the ids */]; 
var arr_id_f = [/* the ids */]; 
var len = "{$ servers output here }";/* elem numbers you want set */ 
function init () { 
    var oa; 
    function getOnDrag (a, b) { 
     return function(x, y) { keepDragEnd(a, b, "A", x, y); } 
    }  
    for (var i = 0; i < len; i += 1){ 
     Drag.init(oa, null, 0, 278, 0, 278); 
     oa = document.getElementById(arr_id[i]); 
     oA.onDrag = oa.onDragEnd = getOnDrag (document.getElementById(arr_id_f[i]), /* you dont mention what should be here */oa1); 
    } 
} 
init() 

jspページにコードを挿入してlenを出力することができます。サーバー側で、ちょうど私の意見では
が、あなたは、それが