Question

我对Javascript和函数都很陌生......我已经尝试尽我所能，但我已经走到了尽头。我要做的是允许用户使用下拉框手动更改数据集的排序顺序。例如，使用以下数据：

Name    SortOrder
Bob     1
John    2
Mary    3
Susan   4
Frank   5
Allison 6
Katie   7
Scott   8

假设用户希望将John显示在列表顶部，将Susan显示为列表中的第二个。当用户将John的SortOrder更改为1时，我希望Bob的SortOrder更改为2.当Susan更改为2时，我希望Bob更改为3而Mary更改为4.我所以关闭这个，但是一旦做出一两个改变，列表就不合作。这是我的功能：

<script>
function changeField(newval, oldval, maxfield, fieldid) {
var val = newval.value;
var oldval = Number(oldval);
var maxfield = Number(maxfield);
for (var i = 1; i <= maxfield; i++) {
    var curval = Number(document.getElementById("sortorder" + i).value);
    if (val < oldval) {
        if (curval >= val && curval < oldval && fieldid != "sortorder" + i) {
            document.getElementById("sortorder" + i).value = curval + 1;
            }
        }
    if (val > oldval) {
        if (curval <= val && curval > oldval && fieldid != "sortorder" + i) {
            document.getElementById("sortorder" + i).value = curval - 1;
            }
        }
    }

for (var n = 1; n <= maxfield; n++) {
    var newfieldid= "sortorder" + document.getElementById("sortorder" + n).value;
    document.getElementById("sortorder" + n).id = newfieldid;
    }
}
</script>

这是选择框：

echo '<select id="sortorder' . $crow['catSortOrder'] . '" onchange="changeField(this, ' . $crow['catSortOrder'] . ', ' . $numcat . ', \'sortorder' . $crow['catSortOrder'] . '\');">';
for ($v=1; $v<=$numcat; $v++) {
echo '<option id="optid" value=' . $v . ($v == $crow['catSortOrder'] ? " selected = \"yes\"" : "") . '>' . $v . '</option>';
}
echo '</select>';

$ crow ['catSortOrder']从SortOrder字段中引入值（Bob = 1，John = 2等）。 $ numcat是列表中的行数（在我的示例中为4）。所以我在函数调用中传递的是新值（在字段更改后），旧值，最大数字和选择字段id（sortorder1，sortorder2等）。

该函数的目的是更改旧值和新值之间的任何适用值。正如我之前所说，如果John改为1，Bob的选择选项将更改为2.如果我将Susan移动到2，则Bob移动到3，然后Mary移动到4.

函数的最后一部分（对于n）用于在进行更改后为选择框的id标记分配新值。因此，当John的值更改为1并且Bob又将其更改为2时，ID将分别更新为sortorder1和sortorder2。

谁能告诉我这里我做错了什么？我是以错误的方式来做这件事的吗？我觉得我很近，但不能完全关闭它！

Answer 1

一个错误是如何获得选择的值。这是正确的方法。 https://stackoverflow.com/a/1085810/2635438

我在这里更正了第一次获得select值。 http://jsfiddle.net/DWDJp/

function changeField(newval, oldval, maxfield, fieldid) {
    var val = newval.value;
    var oldval = Number(oldval);
    var maxfield = Number(maxfield);
    for (var i = 1; i <= maxfield; i++) {
        // var curval = Number(document.getElementById("sortorder" + i).value);
        var e = document.getElementById("sortorder" + i);
        var curval = e.options[e.selectedIndex].value;
        if (val < oldval) {
            if (curval >= val && curval < oldval && fieldid != "sortorder" + i) {
                document.getElementById("sortorder" + i).value = curval + 1;
            }
        }
        if (val > oldval) {
            if (curval <= val && curval > oldval && fieldid != "sortorder" + i) {
                document.getElementById("sortorder" + i).value = curval - 1;
            }
        }
    }

    for (var n = 1; n <= maxfield; n++) {
        var newfieldid = "sortorder" + document.getElementById("sortorder" + n).value;
        document.getElementById("sortorder" + n).id = newfieldid;
    }
}

首先更改有效，但之后会抛出错误。使用浏览器中的开发人员工具查看javascript错误。

尝试使用Select标签和Onchange来定制自定义列表

1 个答案: