gpt4 book ai didi

javascript - 如何在 Javascript DOM 中创建树结构?

转载 作者:行者123 更新时间:2023-11-28 02:59:46 25 4
gpt4 key购买 nike

这听起来太愚蠢/太基础了 - 对此感到抱歉,但我尝试了很多,但无法找到正确的解决方案!

我正在使用下面的代码 - 它使一行文本字段上下移动。不幸的是,上下运动并没有停止,而是在整个页面中持续进行! :)

function up(row) {
// need to stop somewhere
var prevRow = row.previousSibling;
if(prevRow != null) {
row.parentNode.insertBefore(row, prevRow);
}
};

function down(row) {
// need to stop somewhere as well
var nextRow = row.nextSibling;
row.parentNode.insertBefore(row, nextRow.nextSibling);
};

我生成的html是xml和xsl的组合。 XSL 看起来像这样:

<xsl:for-each select=".../...">
<p>
<button type="button" onclick="up(this.parentNode)">Up</button>
<button type="button" onclick="down(this.parentNode)">Down</button>
<input>
...
...
...
</p>
</xsl:for-each>

如上所述,这是有效的,但上下运动不会停止。我尝试将 xsl:for-each 包含在另一个 p 标签和 div 标签中,但都不起作用。我试图将这些 p 标签的父标签作为 body 标签之外的其他标签。

我说清楚了吗?

<小时/>

生成的 HTML 添加如下:

<html>
<head>
<script>
function up(row) {
...
};
function down(row) {
...
};
</script>
</head>
<body>
<form name="edit_form" action="edit.php" method="POST">
...
<?xml version="1.0"?>
...
<p>
<button type="button" onclick="up(this.parentNode)">Up</button>
<button type="button" onclick="down(this.parentNode)">Down</button>
<input name="CRorder[record10354881]" type="text" value="0" disabled="" size="4"/>
<input name="CRpreference[record10354881]" type="text" value="10" disabled="" size="4"/>
<input name="CRlabel[record10354881]" type="text" value="label1"/><input name="CRvalue[record10354881]" type="text" value="22222222222"/></p>
<p><button type="button" onclick="up(this.parentNode)">Up</button>
<button type="button" onclick="down(this.parentNode)">Down</button>
<input name="CRorder[record10354882]" type="text" value="1" disabled="" size="4"/>
...
...
</form></body>
</html>

最佳答案

根据您的 HTML,假设 ...s 不包含使 P 成为子项的匹配标签对,则包含向上/向下按钮(和其他辅助工具)的 P 将在 P 列表中向上移动直到它是 FORM 标记的第一个子标记。由于它与 BODY 标记直接相邻,因此实际上将其在页面上一直向上移动。

编辑:好的,根据您的评论,如果您有 P 标签的其他 sibling ,但您不想将它们移过去,则需要以某种方式标记它们并更改您的向上/向下功能以遵守这些限制。类似...

...<tag id="upperLimit">...

function up(row) {
// need to stop somewhere
var prevRow = row.previousSibling;

if(prevRow != null && prevRow != document.getElementById("upperLimit")) {
row.parentNode.insertBefore(row, prevRow);
}
};

对下限也有类似的限制。

关于javascript - 如何在 Javascript DOM 中创建树结构?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1417940/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com