为什么我的输入字段不能通过javascript验证?

时间:2013-06-26 08:07:44

标签: javascript forms

我有一个select标签和2个输入字段。我想验证输入字段,但每次按下“Godkend”按钮,它都不会验证,它甚至不会读取javascript函数。为什么这很开心?

<div class="well">
    <div class="row-fluid">
        <div class="span3"> 
            <div class="input-holder">
                <select name="rest_id" form="carform">
                <?php foreach ($dropdownArray as $key):?>
                    <option placeholder="rest_id*" id="rest_id" name="rest_id" value="<?=$key['restid']; ?>"> <?= $key['restaurantnavn']; ?> </option>
                <?php endforeach;?>
                </select>
            </div>
        </div>

        <form name="myForm" action="" onsubmit="return validateForm()" id="carform">
            <div class="span3"> 
                <div class="input-holder">
                    <input type="text" class="form-input" id="membernumber" name="membernumber" autocomplete="off" placeholder="Medlems. Nr.*" value="">
                </div>
            </div>
            <div class="span3"> 
                <div class="input-holder">
                    <input type="text" class="form-input" id="subtotal" name="subtotal" autocomplete="off" placeholder="Beløb.*" value="">
                </div>
            </div>
            <div class="span3"> 
                <div class="input-holder">
                    <input type="submit" value="Godkend">
                </div>
            </div>
        </form>
    </div>
</div>

<script>
function validateForm()
{
    var field1=document.forms["myForm"]["membernumber"].value;
    var field2=document.forms["myForm"]["subtotal"].value;
    var myLength = $("#membernumber").val().length;

    if (field1==null || field1=="")
    {
        alert("something A");
        return false;
    }

    if (myLength < 8 || myLength > 8)
    {
        alert("something B");
        return false;
    }

    if (field2==null || field2=="")
    {
        alert("something C");
        return false;
    }
    else
    {
        alert("something D");
        return true;
    }
}
</script>

3 个答案:

答案 0 :(得分:2)

请看一下这个小提琴:http://jsfiddle.net/rYrcY/

<script>
$(function(){
    $("#carform").on('submit', function(){
        var field1 = document.forms["myForm"]["membernumber"].value;
        var field2 = document.forms["myForm"]["subtotal"].value;
        var myLength = $("#membernumber").val().length;

        if (field1 == null || field1 == "") {
            alert("something A");
            return false;
        }

        if (myLength < 8 || myLength > 8) {
            alert("something B");
            return false;
        }


        if (field2 == null || field2 == "") {
            alert("something C");
            return false;
        } else {
            alert("something D");
            return true;
        }
    });
});
</script>

答案 1 :(得分:0)

我一直在here进行测试,似乎有效。

检查您是否在HTML的head中添加脚本,并在javascript包含之前使用Jquery脚本。

<head>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="yourscript.js"></script>
</head>

答案 2 :(得分:0)

我尝试了你的html代码并且它已经读取了js函数。我怀疑你的PHP代码中有什么错误打破了浏览器的解析过程。 Plz再次检查你的整个HTML并在需要时粘贴它。