Question

我有一个表单，我想用javascript验证。我的表单有两个单选按钮，询问用户是否同意某个分类，如果他不同意，他可以从下拉列表中选择自己的新分类。在javascript中我想过滤掉无效的输入组合。

<html>
    <head>
    <script type="text/javascript">
        function isValidForm() 
        {

            if(document.validateClassificationForm.acceptclassification.value == 'yes' && document.validateClassificationForm.newclassification.value != 'default')
            {
                if (confirm('You chose the option to accept the classification obtained by the classifier, but you chose another classification from the drop-down list. Do you want to override the classification by the one you chose?')) 
                    return true;
                else 
                    return false;
            }
            if (document.validateClassificationForm.acceptclassification.value == 'no' && document.validateClassificationForm.newclassification.value == 'default') 
            {
                alert('You chose the option not to accept the classification obtained by the classifier. Please chose another classification from the drop-down list.');
                return false;           
            }

            return true;

        }

        </script>
</head>
<body>

<form method=post onsubmit="return isValidForm()" action="index.php?operacao=validateClassification" name="validateClassificationForm">

    <ol> 

    <li><p>Do you agree with the classification attributed to this patient?</p></li>

    <li>Yes<input type="radio" name="acceptclassification" value="yes" checked><br></li>
    <li>No<input type="radio" name="acceptclassification" value="no"></li>

    <li><p>If you don't agree, chose another classification:</p></li>

    <li><label for="newclassification">Chose classification:</label>
    <select name="newclassification">
    <option value="default">Select</option>
    <option value="emergency">Emergency</option>
    <option value="veryurgent">Very urgent</option>
    <option value="urgent">Urgent</option>
    <option value="slightlyurgent">Slightly urgent</option>
    <option value="noturgent">Not urgent</option>
    </select></li>

    <div id="form-button">
    <li><input type="submit" value="Submit"></li>
    </div>

    </ol>
</form>

</body>

</html>

虽然，javascript似乎永远不会被执行，并且表单总是被提交。我在这里做错了什么？

Answer 1

document.validateClassificationForm.acceptclassification返回 nodeList 对象。所以，你不能简单地写document.validateClassificationForm.acceptclassification.value。 nodeList 对象没有名为 value 的属性。

function isValidForm() {
    var acceptclassification = Array.prototype.slice.call(document.validateClassificationForm.acceptclassification).filter(function (element) {
        return element.checked;
    })[0];
    if (acceptclassification.value == 'yes' && document.validateClassificationForm.newclassification.value != 'default') {
        if (confirm('You chose the option to accept the classification obtained by the classifier, but you chose another classification from the drop-down list. Do you want to override the classification by the one you chose?')) return true;
        else return false;
    }
    if (acceptclassification.value == 'no' && document.validateClassificationForm.newclassification.value == 'default') {
        alert('You chose the option not to accept the classification obtained by the classifier. Please chose another classification from the drop-down list.');
        return false;
    }

    return true;

}

在http://jsfiddle.net/4n8S6/

上查看

使用javascript验证表单值

1 个答案: