こんにちは。
jQuery コードに問題があり、問題を把握できないようです。
状況は次のとおりです。
私は(mysql-entriesに基づいて)いくつかのdivを作成しています。最初に結果を示したほうがよいかもしれません。
<div class="shipcontainer" id="shipcontainer1">
<div class="timelinecontainer" id="timelinecontainer1">timeline--></div>
<div class="travelsall" data-ship="1">
<div class="travelcontainer" data-travelid="1" data-ship="1" id="travelcontainer1">
<div class="fasecontainer" data-travelid="1" data-ship="1">
<div class="Mobilize travelfase" date-days="6" date-fasetravelid="1">1: Mobilize </div>
<div class="Loading travelfase" date-days="12" date-fasetravelid="1">2: Loading</div>
<div class="Boating travelfase" date-days="20" date-fasetravelid="1">3: Boating</div>
<div class="Discharge travelfase" date-days="6" date-fasetravelid="1">4: Discharge</div>
</div>
<div class="options" id="optionstravel1" data-travelid="1">OPTIONS</div>
</div>
</div>
</div>
ご覧のとおり、shipcontainerdiv があります。i 内には 2 つの子 div (timelinecontainer と travelsall) があります。後者には、この例では「.travelcontainer」が 1 つしか含まれていませんが、将来はさらに増える予定です。
このコードは数回繰り返されます (現在、2 つの ".shipcontainers" があります)。
私が達成したかったのは、「.travelcontainer」で div の幅を「.travelfase」で 4 つの div の幅の合計に設定することでした。これは私のjQueryコードです:
var totalWidth = 0;
$(".travelcontainer").width(function () {
var travelID = $(this).data(travelid);
$(this).find('div[data-fasetravelid=' + travelID + ']').each(function (index, element) {
totalWidth = $(this).innerWidth() + totalWidth;
});
return totalWidth;
});
PHP による解析中に、「.travelcontainer」に data-travelid 属性を与え、「.travelfase」の孫でもあるためです。このように結合できると考えました。
問題は、2 つの shipcontainer があり、両方の「travelcontainer」を使用すると、すべての値が加算されることです。したがって、data-travelid=1 の travelcontainer の幅は、data-fasetravelid=1 属性の div だけではなく、クラス travelfase のすべての div とまったく同じです。
このコードも試しました(以前に使用したものです):
var widthTotal = 0;
$(".travelcontainer").width(function () {
$(".travelcontainer > .travelfase").each(function (index, element) {
widthTotal = $(this).innerWidth() + widthTotal;
});
});
return widthTotal;
これも同様の効果があります。
ここで私が間違っていることを誰かが見ていますか?
前もって感謝します!