从表单中提取数据?

时间:2013-02-28 23:03:43

标签: javascript

我正在尝试创建一个脚本来提取已提交的输入&使用它根据所选内容发送警报,但每当我这样做时,它似乎并不相应。

有什么答案吗?

使用Javascript:

<script language="Javascript" type="text/javascript">
    function checkForm() {
        alert(form.option.value);
        if (form.option.value == "one") {
            alert("Test 1");
        } else if (form.option.value == "two") {
            alert("Test 2");
        } else {
            alert("Test 3");
        }
    }
</script>

HTML:

<form onsubmit="checkForm()">
    <select>
        <option value="one">One</option>
        <option value="two">Two</option>
        <option value="three">Three</option>
    </select>
    <input type="submit" name="option">
</form>

2 个答案:

答案 0 :(得分:1)

您当前的代码无效,因为您的方法会出错:

Uncaught ReferenceError: form is not defined

您需要获取正确元素的句柄。 form不仅会存在,option.value也不正确。

获取您的相关元素,如下所示:

<script language="Javascript" type="text/javascript">
    function checkForm() {
        var form = document.forms[0];
        var selectElement = form.querySelector('select');
        var selectedValue = selectElement.value;

        alert(selectedValue);
        if (selectedValue == "one") {
            alert("Test 1");
        } else if (selectedValue == "two") {
            alert("Test 2");
        } else {
            alert("Test 3");
        }
    }
</script>

DEMO


除了完整性之外,正如另一个答案中已经提到的那样,如果您希望在某些时候阻止提交,请将表单标记更新为onsubmit="return checkForm()"并在return false;方法中添加checkForm()在相关位置,即:在其中一个警报之后。

答案 1 :(得分:0)

onsubmit="checkForm()"更改为onsubmit="return checkForm()"

首先从该函数返回false。这将阻止刷新页面。

PS:并在函数顶部添加debugger以触发浏览器的调试器。