Javascript getElementById 表现奇怪答案

【问题标题】：Javascript getElementById acting oddJavascript getElementById 表现奇怪
【发布时间】：2010-12-24 17:12:36
【问题描述】：

我正在使用 for 循环循环通过一些具有起始值的元素（飞机上的座位）。

这里是：
seatNum - 要循环通过的座位数
startSeat - 开始骑行的座位

我从“onsubmit”表单调用函数。

当我尝试获取具有“s1”“s2”“s3”等 id 命名约定的元素时，问题出现在 for 循环中...“s45”“s46”等...基于循环柜台添加到起始座位。从0（起始座位）到seatNum（多少座位）。

知道为什么按 id 不能正确解析吗？除了 for 循环中的最后一个之外，所有其他都可以正常工作。

是的，我是编程新手，所以我可能没有最佳实践，请在风格上宽容。

function check() {
    var startSeat;
    var fName = document.getElementById('fName').value
    var lName = document.getElementById('lName').value
    var address = document.getElementById('address').value
    var city = document.getElementById('city').value
    var state = document.getElementById('state').value
    var zip = document.getElementById('zip').value
    var phone = document.getElementById('phone').value
    var seatNum = document.getElementById('seatNumber').value
    var y=document.getElementById('seatList1').value;
    var z=document.getElementById('seatList2').value;

    if (z >= y) {
        startSeat = y;
    }
    else {
        startSeat = z;
    }

    if ( (fName == "") || (lName == "") || (address == "") || (phone == "") || (zip == "") || (state == "") || (city == "") ) {
        alert("You must fully complete the form");
        return false;
    }

    for (var i = 0; i < seatNum; i++) {
        if (document.getElementById("s"+(startSeat+i)).className=="taken"){
            alert("Selected seat(s) already booked.");
            return false;
        }
    else {
            continue;
        }
    }
}

【问题讨论】：

你是如何设置类似 s 的 ID 的？它们是带有页面标记的，还是在页面加载后使用 javascript 创建的？
在标记中。这里实际上是一张桌子 -> pixology.net/planesite

标签： javascript object loops plane

【解决方案1】：

试试这个：

for (var i = startSeat; i < seatNum; i++) {
    if (document.getElementById("s"+i).className == "taken") {
        alert("Selected seat(s) already booked.");
        return false;
    }
}

不要将i 添加到startSeat 值以获取座位ID，而是在循环初始化中使用startSeat's 值。我相信发生的事情是你得到了一个off-by-one error，因为你的startSeat 值已经设置好了，然后你向它添加了i，这让你领先了一个。

【讨论】：

问题是 startSeat 可以是从 1 到 104 的数字，而 seatNum 将永远是一个较小的数字。所以上面的条件 (i

【解决方案2】：

我不确定，但也许 startSeat+i 连接了字符串，而不是做你期望的数学加法。尝试向屏幕发出警报：

alert(document.getElementById("s"+(startSeat+i)));

是字段名吗？

【讨论】：

【解决方案3】：

您可能会重复一个太多次。在你的 for 循环中尝试i < seatNum - 1

【讨论】：

【解决方案4】：

将您的 y 和 z 变量转换为数字：

var y = +document.getElementById('seatList1').value;
var z = +document.getElementById('seatList2').value;

var startSeat = (z >= y) ? y : z; // or simply startSeat = Math.min(z,y);

这将解决@Faruz 指出的问题。

【讨论】：

谢谢。我可以说这个网站对我来说是个问题。 :)

【解决方案5】：

当您说循环座位时，我假设您想在达到最大座位后从 1 继续数？假设 numberOfSeats 是在某个地方定义的（我看不到它，但你必须在某个地方拥有它），你可以这样做：

"s"+((startSeat + i - 1) % numberOfSeats + 1)

所以这行是完整的：

if (document.getElementById("s"+((startSeat + i - 1) % numberOfSeats + 1)).className=="taken"){

【讨论】：

【解决方案6】：

你真正得到的是字符串连接，所以真正发生的是：

i = 10
seatNum = 1

(seatNum+i) = "110"

尝试使用parseInt() 函数将变量转换为整数类型：

if (document.getElementById("s"+(parseInt(startSeat)+parseInt(i))).className=="taken")

【讨论】：

【解决方案7】：

在我看来 startSeat 是一个字符串类型。尽管 JavaScript 是无类型的，但 DOM 对象的值将默认为字符串。所以，你得到的是串联而不是加法。

使用 CMS 编写的内容。这应该可以解决您的问题。

【讨论】：