Question

这是我的Html代码：

<head>
    <script src="jquery.js"></script>

    <script type="text/javascript">
        function logiin()
        {
            name_sent = document.getElementById('username').value;
            pass_sent = document.getElementById('pass').value;
            $.post(
                'login.php',
                {
                    name: name_sent
                },
                function show(data) {alert (data); }
            );
        }
    </script>
</head>

<body>
    <!--<form>-->
        Username: <input type="username" name="username" id="username"> <br>
        Pass: <input type="password" name ="pass" id="pass"> <br>
        <input type="submit" onclick="logiin();">
    <!--</form>-->
</body>

它适用于ajax和JQuery，也非常好用！ :)但如果我添加表单标签，它不起作用！为什么？

Answer 1

它不起作用，因为当包含在表单中时，提交按钮将尝试提交表单。

防止这种情况发生的最简单方法是将return false;添加到onclick处理程序中：

<input type="submit" onclick="logiin(); return false;" />

但更好的方法是将处理程序添加到表单本身（如果用户以另一种方式提交表单）：

<form onsubmit="logiin(); return false;">
    <!-- Form elements here -->
</form>

Answer 2

只需停用提交。如果没有类型为提交的按钮，则表单将不会被提交，除非您明确地在JavaScript代码中执行此操作。

<body>
    <form>
        Username: <input type="username" name="username" id="username"> <br>
        Pass: <input type="password" name ="pass" id="pass"> <br>
        <input type="button" onclick="logiin();">
    </form>
</body>

Answer 3

可能是因为您使用的是提交类型的输入按钮。尝试使用按钮类型的输入。

<input type="button" onclick="logiin();">

提交类型的按钮会自动尝试使用帖子提交表单。有关详细信息，请参阅w3c Schools。

当我想使用ajax时，标签的形式是什么？

3 个答案: