Javascript验证工作,但表单不提交

时间:2014-02-06 17:24:13

标签: javascript html forms

我有这种形式,例如在A类中,你只能写出以1开头的数字,依此类推:

 <form accept-charset="UTF-8" action="verify.php" id="form" method="post">
 <label id="type" for="type" class="">Type</label>
 <select class="" id="Type" name="type">
 <option id="a" value="1">Type A</option>
 <option id="b" value="2">Type B</option>
 <option id="c" value="3">Type C</option>
 <option id="d" value="4">Type D</option>
 <option id="e" value="5">Type E</option>
 </select>
 <label for="type_number" class="inner_text">Type Number</label>
 <input name="type_number" type="text" class="false" id="type_number" />
<input type="button" id="Confirm" value="Confirm" />
 </form>

这个Javascript:

 document.getElementById('Confirm').onclick = function () {

    var letter = document.getElementById("type_number").value.match(document.getElementById("Type").value);
    if (letter !== null) {
        letter = letter[0].toLowerCase();
        this.value = letter + this.value.substring(1);
    }
    else {
    alert('Number is not correct!');
    }
  }

验证工作,但没有提交,当一个好的答案被写入时,'确认'被重命名为'1onfirm',只有这种情况发生。

检查jsfiddle:http://jsfiddle.net/focusoft/hSmFS/1/

感谢。

2 个答案:

答案 0 :(得分:2)

在javascript函数中提交表单或更改确认按钮类型以提交。

更改您的javascript功能

document.getElementById('Confirm').onclick = function () {

    var letter = document.getElementById("type_number").value.match(document.getElementById("Type").value);
    if (letter !== null) {
        letter = letter[0].toLowerCase();
        this.value = letter + this.value.substring(1);
        document.forms[0].submit();
    }
    else {
    alert('Number is not correct!');
    }
  }

答案 1 :(得分:1)

改变这个:

<input type="button" id="Confirm" value="Confirm" />

为此:

<input type="submit" id="Confirm" value="Confirm" />