Question

I have a form where I use the following system: the fields and their labels are float: left and an extended comment explaining how to fill in the field appears far to the right, positioned with a wide left margin.
Following a suggestion in an Eric Meyer book, I use an hr to align the two: I put an hr styled with:

.lineup { clear:both; visibility: hidden}

Then I use Javascript to make the comment display when I want it.
This works great, except (for some weird problem in Safari and) when the comment is really long, when it "pushes down" the other form content as it appears.
So, I said, I can write a Javascript function to run on page build, to delete the hr s (remembering their offsetTop s) and move all the descriptions to somewhere near where the hr s were.
But I can t get it to remove the hr s.

最后,该法:

var hrListY = new Array();              // Y-coordinates of HR "lineup" elements

// Moves all descriptions so their middle is where the top used to be, and
// removes the <hr>s previously used to position them.

function relayoutDescriptions() {
        var hrs = document.getElementsByTagName("hr");
        alert( hrs.length =   + hrs.length);
        var i;
        for (i = 0; i < hrs.length; i++) {
                var hr = hrs[i];
                if (hr.className ==  lineup ) {
                        hrListY.push(hr.offsetTop);
                        alert( Got an HR element: Y =   + hr.offsetTop +   parentNode class = "  + hr.parentNode.className +  " );
                        hr.parentNode.removeChild(hr);
                        }
                }

// Now we have a list of Y-coordinates of HR elements, hrListY.  We use it
// to adjust the offsetTop s of the -desc divs.  For each one, we adjust the
// offsetTop so the center of the div is at the height where the HR was.

        }

这是我迄今为止都拥有的。它给我以合理的排位数字,用于抵销,并给人一个有理的母子,但由此造成的布局清楚表明,而且火烧证实,幼.仍然存在。

Help?

P.S.
If there s an easy way to do this with JQuery, I m amenable to that, but I d REALLY like to know what the $@#&*% is going on here.

感谢!

Answer 1

由getElementsByTagName归还的标注清单是活着的,这意味着,如果你将其中一项内容从人力部移走,则右边的事情只能去除第二个项目。

http://www.w3.org/TR/DOM-level-2-Core/core.html”rel=“nofollow” http://www.w3.org/TR/DOM-level-2-Core/core.html。

莫斯科的NodeList和NamedNodeMap物体是活着的,即对基本文件结构的改动反映在所有有关的NodeList和NamedNodeMap物体中。

您可以看到,通过将<代码>alert(小时=+小时:length);移入你的 lo。它将每次提醒人数不同。

To fix this, you can copy the list

var myNodeList = document.getElementsByTagName( HR );
myNodeList = Array.prototype.slice.call(myNodeList);

或者你可以放弃离开的权利

var myNodeList = document.getElementsByTagName( HR );
for (var i = myNodeList.length; --i >= 0;) {
  ...
}

因此,当你去除一个物品时,改变你的指数就没有任何权利。

友情链接