Question

我正在使用JavaScript构建表单发送函数，并且我遇到了每次都执行else if语句的问题。这是我的剧本：

this.submit = function() {
    var url = this.url + "?";
    for(el in this.elements) {
        var e = $(this.elements[el]);
        var n = this.names[el];
        if(n === "submit")
        {
            window.alert("submit");
        }
        else
        {
        url += n + "=";
        }
        if(el == "#dropdown")
        {
            var options = e.children();
            for(var i = 0; i < options.length; i++) {
                var option = $('#' + options[i].id);
                if(option.attr('selected'))
                {
                    url += option.attr('name');
                    url += "&";
                    window.alert("dropdown worked");
                    break;
                }
            }
        }
        else if(el != "#submit") {
            url += e.attr('value');
            url += "&";
            window.alert("input worked");
        }
    }
    window.location.href = url;
};

问题是即使有问题的ID是“#submit”，else if(el != "#submit"){}也会运行。有谁知道为什么这不起作用？

要提供帮助，这是我的php文档，以及表单构造函数的其余部分：

PHP：

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<?php if(!$_GET): ?>
<form id="form1">
    <input type="text" id="input1" name="name"/>
    <br>
    <select id="dropdown" name="color">
        <option id="null" name="null"></option>
        <option id="opt1" name="blue">blue</option>
        <option id="opt2" name="yellow">yellow</option>
    </select>
    <br>
    <button type="submit" id="submit" name="submit"onclick="form1.submit()">Submit data</button>
</form>
<script src="http://charlie/form.js"></script>
<script>
    var form1 = new form("form1");
    form1.setElements();
    form1.logElements();
</script>
<?php elseif(!(isset($_GET['name']) || isset($_GET['color']))): ?>
<p style="color:red">ERROR! form.js failed</p>
<?php else: ?>
<p><?= $_GET['name'] ?></p>
<p><?= $_GET['color'] ?></p>
<?php endif; ?>
</body>
</html>

form constructer：

function form(id) {
this.id = "#" + id;
this.url = window.location.href;
this.elements = [];
this.names = [];
this.setElements = function() {
    var elements = [],names = [],children = $(this.id).children();
    for(var i = 0; i < children.length; i++) {
        var childid = children[i].id;
        if(childid)
        {
            elements.push('#' + childid);
        }
    }
    this.elements = elements;
    for(var e in this.elements) {
        names.push($(this.elements[e]).attr('name'));
    }
    this.names = names;
};
this.logElements = function() {
    for(var e in this.elements) {
        console.log(this.elements[e]);
    }
    for(var n in this.names) {
        console.log(this.names[n]);
    }
};
this.submit = function() {
    var url = this.url + "?";
    for(el in this.elements) {
        var e = $(this.elements[el]);
        var n = this.names[el];
        if(n === "submit")
        {
            window.alert("submit");
        }
        else
        {
        url += n + "=";
        }
        if(el == "#dropdown")
        {
            var options = e.children();
            for(var i = 0; i < options.length; i++) {
                var option = $('#' + options[i].id);
                if(option.attr('selected'))
                {
                    url += option.attr('name');
                    url += "&";
                    window.alert("dropdown worked");
                    break;
                }
            }
        }
        else if(el != "#submit") {
            url += e.attr('value');
            url += "&";
            window.alert("input worked");
        }
    }
    window.location.href = url;
};
}

Answer 1

将我的评论转化为一些代码的答案。＆＃34; in＆＃34; Javascript中的运算符迭代属性而不是每个索引处的元素。要使当前代码生效，请将代码更改为以下内容：

var el;
var elementCount = this.elements.length;
for (var i = 0; i < elementCount; i++) {
    el = this.elements[i];

这将产生预期的行为。

Answer 2

for ... in循环是原因。 el tkaes值0,1,2 ......您需要比较this.elements[el]而不是el：

if(this.elements[el] == "#dropdown") ... 
else if(this.elements[el] != "#submit") {

...

为什么我的elseif语句每次都在运行

2 个答案: