我有以下功能：
function mattes_create_matte_array(mattes, selected_type)
{
...
$(mattes).each(function(i, el) //loop through the mattes xml
{
fillets = $(el).find("fillet")[0];
console.log("i: " + i);
if(typeof(fillets) !== "undefined")
{
switch (i)
{
case 0: fillet_selected_matte = "fillet_matte_layer_top"; console.log(fillet_selected_matte);break;
case 1: fillet_selected_matte = "fillet_matte_layer_middle"; console.log(fillet_selected_matte);break;
case 2: fillet_selected_matte = "fillet_matte_layer_bottom"; console.log(fillet_selected_matte);break;
}
fillet_change($(fillets).find("imgsrc").text(), $(fillets).find("cid").text(), $(fillets).find("sku").text());
}
...
}
当我输出fillet_selected_matte时，我总是回来＆＃34; fillet_matte_layer_top＆＃34;，当我希望输出每个＆＃34; fillet_matte_layer _...＆＃34;
console.log（el）是以下
<mat>
<item size="0">
<imgsrc>11852997eab43ff5c7b1803692bee608</imgsrc>
<size>0</size>
<cpu>20</cpu>
<cid>4208</cid>
</item>
<fillet>
<imgsrc>113a2584b32539ecdc35d70b39fde504</imgsrc>
<width>0.31</width>
<cid>9352</cid>
<sku>TD00060S1</sku>
</fillet>
</mat>
<mat>
<item size="0.5">
<imgsrc>579767cea6941301e6f91d43580a1948</imgsrc>
<size>0.5</size>
<cpu>0</cpu>
<cid>4390</cid>
</item>
<fillet>
<imgsrc>fee7ec5a4b50b65e94801682ae076a5a</imgsrc>
<width>0.31</width>
<cid>9348</cid>
<sku>TD00052S0</sku>
</fillet>
</mat>
<mat>
<item size="0.5">
<imgsrc>11852997eab43ff5c7b1803692bee608</imgsrc>
<size>0.5</size>
<cpu>0</cpu>
<cid>42089349</cid>
</item>
<fillet>
<imgsrc>5ade25e607b6302691c318a94792e6eb</imgsrc>
<width>0.31</width>
<cid>9349</cid>
<sku>TD00060GL1</sku>
</fillet>
</mat>
这里是fillet_change的代码：
function fillet_change(thumb, cid, sku)
{
if (mattes_selected_type == 15) //letter mattes
{
alert("Fillets can only be applied to rectangular openings. Your current layout does not contain any rectangular openings, fillet was not applied");
return;
}
var img = new Image();
img.src = SITE_URL + '/system/components/compimg/' + thumb + '/pattern';
img.onload = function()
{
width = .31;
img.width = width * ppi; //TODO: Get actual width from xml?
img.height = width * ppi; //TODO: Get actual width from xml?
$( document ).ready(function()
{
$("div[id^='opening_']").each(function(i) //for each div that has an id of opening_(number)
{
//Set the values in the array with the width and height
switch(fillet_selected_matte)
{
case "fillet_matte_layer_bottom":
moulding_matte_canvas_width[i] = $("#opening_" + i).width();
moulding_matte_canvas_height[i] = $("#opening_" + i).height();
index = 2;
break;
case "fillet_matte_layer_middle":
moulding_matte_canvas_width[i] = $("#opening_" + i).width() + 10;
moulding_matte_canvas_height[i] = $("#opening_" + i).height() + 10;
index = 1;
break;
case "fillet_matte_layer_top":
if (mattes_default_selected == true)
{
moulding_matte_canvas_width[i] = $("#opening_" + i).width() + 22;
moulding_matte_canvas_height[i] = $("#opening_" + i).height() + 22;
}
else
{
moulding_matte_canvas_width[i] = $("#opening_" + i).width();
moulding_matte_canvas_height[i] = $("#opening_" + i).height();
}
index = 0;
break;
}
var parser = new DOMParser(); //create a new DOMParser
var doc = parser.parseFromString(mattes_get_mattes_xml(), "application/xml"); //convert the string to xml
doc.getElementsByTagName('fillet')[index].innerHTML = "<imgsrc>" + thumb + "</imgsrc><width>" + width + "</width><cid>" + cid + "</cid><sku>" + sku + "</sku>";
var serializer = new XMLSerializer(); //create a new XMLSerializer
mattes_mattes_xml = serializer.serializeToString(doc); //convert the xml back to a string
common_get_order_xml();
moulding_draw(img, "fillet"); //Call the moulding_draw function, which draws the fillet on the canvas
});
});
};
}
这里是moulding_draw的代码：
function moulding_draw(img, fillet)
{
$(document).ready(function() {
$("div[id^='opening_']").each(function(i) //for each div that has an id of opening_(number)
{
if (fillet == "fillet")
{
$("#fillet_canvas_" + fillet_selected_matte + "_" + i).remove(); //remove the selected filet canvas
}
else
{
$("#moulding_canvas").remove(); //remove the moulding canvas
}
var canvas = document.createElement('canvas');
var ctx = canvas.getContext("2d");
if (fillet == "fillet")
{
canvas.id = "fillet_canvas_" + fillet_selected_matte + "_" + i; //create a fillet canvas for each element
console.log(canvas.id);
}
else
{
canvas.id = "moulding_canvas";
}
canvas.style.position = "absolute";
canvas.style.zIndex = 5;
if (fillet == "fillet")
{
//Set the positioning of the fillets
switch(fillet_selected_matte)
{
case "fillet_matte_layer_bottom":
fillet_bottom_left = parseInt($("#opening_" + i).css('left')) - img.width + "px";
canvas.style.left = fillet_bottom_left;parseInt($("#opening_" + i).css('top')) - img.width + "px";
fillet_bottom_top = parseInt($("#opening_" + i).css('top')) - img.width + "px";
canvas.style.top = fillet_bottom_top;
break;
case "fillet_matte_layer_middle":
fillet_middle_left = parseInt($("#opening_" + i).css('left')) - img.width - 5 + "px";
canvas.style.left = fillet_middle_left;
fillet_middle_top = parseInt($("#opening_" + i).css('top')) - img.width - 5 + "px";
canvas.style.top = fillet_middle_top;
break;
case "fillet_matte_layer_top":
if (mattes_default_selected == true)
{
fillet_top_left = parseInt($("#opening_" + i).css('left')) - img.width - 12 + "px";
canvas.style.left = fillet_top_left;
fillet_top_top = parseInt($("#opening_" + i).css('top')) - img.width - 12 + "px";
canvas.style.top = fillet_top_top;
}
else
{
fillet_top_left = parseInt($("#opening_" + i).css('left')) - img.width + "px";
canvas.style.left = fillet_top_left;
fillet_top_top = parseInt($("#opening_" + i).css('top')) - img.width + "px";
canvas.style.top = fillet_top_top;
}
break;
}
}
else
{
canvas.style.left = "-" + img.width + "px";
canvas.style.top = "-" + img.height + "px";
}
canvas.height = parseInt($("#matte_canvas").height()) + (img.height * 2);
canvas.width = parseInt($("#matte_canvas").width()) + (img.width * 2);
moulding_draw_elements(ctx, img, i); //call the function to actually draw the moulding elements
if (fillet == "fillet")
{
$(canvas).insertAfter("#opening_" + i); //insert the canvas after the specific opening
}
else
{
$("#mattes").append(canvas); //appending the canvas
}
});
});
}
答案 0 :(得分：2)
只需删除$(el).find("fillet")[i]
e.g。获取唯一的DOM元素（或未定义）
$(el).find("fillet")[0];
您正在根据父级索引访问子元素，但每个fillet（最大）中只有一个mat。请注意，问题已经改变，所以现在这个答案可能没什么意义了：）