javascript - HTML 表单模糊调用 PHP 的 JQuery 函数调用

标签 javascript php jquery html blur

我是一个 JQuery/JS 新手,在简单的 .blur() 事件调用方面遇到了麻烦。

基本上我有一个 html 表单,其输入具有“id='validate'”,应该调用 php 脚本来验证数据库中表单的输入元素中键入的内容是否存在。

任何帮助将不胜感激!

目前我收到错误:“SyntaxError:missing:after property id @ line 6”[at 'alert("Called!!"),'],但如果我将其注释掉,那么什么也不会发生.

HTML:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src='../js/validate.js'></script>
<!DOCTYPE html>
<html>
...
<body>
...  
<form method="POST" action="upload.php?t=0" class="formbox" style="float:left;" name='aform'>
    <label>Category: </label><input type="text" id='validate' maxlength="30" name="category"/><br />

    <input style="margin-left:35%;width:130px;" type="submit" value="Submit Article" />                     
</form>
...
</body>
</html>

验证.js:

$(document).ready(function(){
    $('#validate').blur(function(){
        $.ajax({

                type: "POST",
                url: "../php/validate.php",
                data: aform.elements["category"].value,
                success: function(msg){
                    alert("Category exists!");
                },
                error: function(){
                    alert("Error!");
                }

         });
    });
});

验证.php:

<?php
    include '../php/db.php';
    echo "Called!";

    $cat = mysqli_real_escape_string($con, $_POST['category']);

    $query = mysqli_query($con, "SELECT DISTINCT * FROM Category WHERE Name='".$cat."';");

    if(mysqli_num_rows($query) == 1){
        echo "Category Exists!";
    }else if(mysqli_num_rows($query) == 0){
        echo "No Category with that name found!";
    }else{
        echo "Too many Categories found!";
    }
?>

提前致谢!

编辑:为了将来的引用,我在引用 POST 数据时遇到了麻烦,我最终将“data: aform.elements["category"].value,”更改为 'data:"cat="+document.querySelector( js 文件中的 '[name = "category"]').value,' 并在 php 文件中引用 "$_POST['cat']"

最佳答案

我注意到的一些事情,您的 alert 函数调用不应放置在 ajax 调用的选项对象内 - ajax 调用期望将其选项定义为 key : value pairs - 如果您想设置 ajax 函数已被调用的警报,您可以将其放置在 beforeSend 回调中 - 该回调在发送 XmlHttpRequest 之前触发。代码看起来像这样:

$(document).ready(function(){
$('#validate').blur(function(){
    $.ajax({

            beforeSend: function() { alert("Called!!"); },
            type: "POST",
            url: "../php/validate.php",
            data: aform.elements["category"].value,
            success: function(msg){
                alert("Category exists!");
            },
            error: function(){
                alert("Error!");
            }

     });
});
});

另外,html 元素的 id 属性对于该文档应该是唯一的,因此,如果您在页面上的多个表单输入上使用 id="validate",则该页面将不是有效的 html - 尝试将选择器更改为类名并调用模糊函数,如下所示 $('.validate').blur(function() ...

此外,成功回调仅意味着 XmlHttpRequest 已完成,不会指示服务器已返回哪些数据,因此,由于请求已完成而发出类别存在的警报可能会给您带来误报,这是一种更好的方法将在成功回调中使用 alert(msg)

这里是 $.ajax 上的查询文档的链接这应该会为您清除一些事情:

关于javascript - HTML 表单模糊调用 PHP 的 JQuery 函数调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19159807/

相关文章:

php - 记录 Amazon SES 消息 ID

php - 单击保存按钮时如何保存在多个表中?

javascript - JS - 工厂模式在存储在内存中时覆盖私有(private)变量

javascript - knockout 实时搜索

Javascript url 验证允许相对和绝对 url

javascript - 如何使用 JavaScript 或 jQuery 让我的 "input a word"脚本正常工作?

javascript - 在jquery中使用get函数时脚本不运行

javascript - (Angular)在我的情况下如何返回不同的 Observable 类型请求?

php - 使用 https 在 header 中隐藏密码

c# - ASP.NET MVC3 向下钻取复选框列表