如何在Javascript中向上或向下移动文本行

时间:2017-10-04 02:25:29

标签: javascript jquery html jquery-ui

我面临着关于向上移动或向下移动文本行的问题,当我向上或向下移动行时,它可以移动但看起来旧行仍然存在并且未被删除 enter image description here

例如: 我向下移动文本2',它可以移动但行仍然存在

这是我的消息来源:

<head>
<script>
function down_move(index)
{
var frm = document.writeForm;
var opts=frm["ans_list" + index].options

for (var i=opts.length-1; i>=0; i--) {
    if (opts[i].selected && i<opts.length-1) {
        tmp = opts[i].cloneNode(true);
        // opts[i].removeChild(true);
        opts[i].removeChild(opts[i].childNodes[0]);
        opts[i].insertAdjacentElement("afterEnd", tmp).selected = true;
    }
}
 setting_val(index);
}
</script>
</head>

<body>
<div>
   <a href="#" onClick="javasript:down_move('<%=i+1%>');" style="float:left"><span class="bt_test_admin bg_type_01">▼ Order</span></a>
</div>
</body>

我从控制台错误浏览器收到消息:

Uncaught TypeError: Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'.

如何修复错误?感谢

2 个答案:

答案 0 :(得分:1)

您必须找到该按钮的父 tr ,然后找到之前追加的元素。因为在一个元素之后没有附加函数,所以当你想要向下移动时,你必须找到第二个下一个元素。

分别在行上行和下行行同时应用此功能。我相信它对您有用

上移功能

function MoveUpRow() {
    var table,
        row = this.parentNode;

    // find the parent tr ( the row element )
    while ( row != null ) {
        if ( row.nodeName == 'TR' ) {
            break;
        }
        row = row.parentNode;
    }
    // the parent of the row is the table body
    table = row.parentNode;
    // insert the row before it's previevs siblings
    table.insertBefore ( row, get_previoussibling( row ) );
}

向下移动行功能

function MoveDownRow() {
    var table,
        row = this.parentNode;

    while ( row != null ) {
        if ( row.nodeName == 'TR' ) {
            break;
        }
        row = row.parentNode;
    }
    table = row.parentNode;
    // you have to find the second next siblings to append before
    // NOTE: if the second parameter of the 'insertBefore' function is null
    //       it will append the row to the table! 
    table.insertBefore ( row, get_nextsibling ( get_nextsibling( row ) ) );
}

答案 1 :(得分:0)

您的问题是缺少HTML上下文。无论如何,从select中删除选项似乎是错误的

我改变了你的代码。

function down_move(index)
{
var frm = document.writeForm;
var elSelect = frm["ans_list" + index];
var opts=elSelect.options

for (var i=opts.length-1; i>=0; i--) {
    if (opts[i].selected && i<opts.length-1) {
        tmp = opts[i].cloneNode(true);
        tmp.selected=true;
        // opts[i].removeChild(true);
        elSelect.remove(i);
        elSelect.add(tmp, i + 1);
    }
}
 setting_val(index);
}