admin管理员组

文章数量:1357220

I have a form which uses ajax for data submitting. Here is the html:

<form>
    <input type="text" id="content" name="content">
    <input type="submit" class="button" name="button">
</form>    

and the JavaScript (jQuery):

$(function() {
    //Update Message...
    $(".button").click(function() {
        var boxval = $("#content").val();
        var dataString = 'content='+ boxval;

        if(boxval=='')
        {
            alert("Please Enter Some Text");
        }
        else
        {
            $("#flash").show();
            $("#flash").fadeIn(400).html('<img src="ajax-loader.gif" align="absmiddle"> <span class="loading">Loading Comment...</span>');

            $.ajax({
                type: "POST",
                url: "update_data.php",
                data: dataString,
                cache: false,
                success: function(html){
                    $("ol#update").prepend(html);
                    $("ol#update li:first").slideDown("slow");
                    document.getElementById('content').value='';
                    document.getElementById('content').focus();
                    $("#flash").hide();
                }
            });
        } 
        return false;
    });
});

It is all working fine, but there is a big problem: I cannot stop spam. Last time I used spam filters, it was in PHP (I used a hidden input and then checked in the PHP file if it is filled out). But that was totally in PHP, no JS.

So here is my question: How could I stop spam in this form submission? Also, can I create an if statement in the update_data.php file?

I have a form which uses ajax for data submitting. Here is the html:

<form>
    <input type="text" id="content" name="content">
    <input type="submit" class="button" name="button">
</form>    

and the JavaScript (jQuery):

$(function() {
    //Update Message...
    $(".button").click(function() {
        var boxval = $("#content").val();
        var dataString = 'content='+ boxval;

        if(boxval=='')
        {
            alert("Please Enter Some Text");
        }
        else
        {
            $("#flash").show();
            $("#flash").fadeIn(400).html('<img src="ajax-loader.gif" align="absmiddle"> <span class="loading">Loading Comment...</span>');

            $.ajax({
                type: "POST",
                url: "update_data.php",
                data: dataString,
                cache: false,
                success: function(html){
                    $("ol#update").prepend(html);
                    $("ol#update li:first").slideDown("slow");
                    document.getElementById('content').value='';
                    document.getElementById('content').focus();
                    $("#flash").hide();
                }
            });
        } 
        return false;
    });
});

It is all working fine, but there is a big problem: I cannot stop spam. Last time I used spam filters, it was in PHP (I used a hidden input and then checked in the PHP file if it is filled out). But that was totally in PHP, no JS.

So here is my question: How could I stop spam in this form submission? Also, can I create an if statement in the update_data.php file?

Share Improve this question edited Oct 2, 2011 at 8:57 Shef 45.6k15 gold badges82 silver badges90 bronze badges asked Oct 2, 2011 at 8:44 AkosAkos 2,0076 gold badges28 silver badges42 bronze badges 1
  • 1 First of all, you need to start indenting your code and stop mixing jQuery with plain JavaScript (document.getElementById('content').value=''; document.getElementById('content').focus(); => $('#content').val().get(0).focus()). Besides that, if you create a form that has no valid action bots are unlikely to successfully submit it - and for real users with JavaScript enabled you specify the target URL in the $.ajax call anyway. – ThiefMaster Commented Oct 2, 2011 at 8:55
Add a ment  | 

2 Answers 2

Reset to default 5

I you do not like to add Captcha here is a good solution:

First add input that is hidden with css in the form. If the bot submits the form the hidden field will have some value filled by the bot. In normal cases the human will not see it and will be empty. In the case of a bot you will check it and if it has some value you will discard. Also you need to add input (also hidden with css) with javascript on document ready. If it is browser it will execute the javascript and will insert the input in the form. If it is a bot then the bots do not execute js and there will be no input field generated by js and on the server side you will see that there is no such field and you will discard the request.

So on the server side you will check if the first hidden field has value or the second hidden field does not exist discard the request.

First fast answer is putting inside the form something that could help you to understand if the user submitting your form is a bot or not.

Captcha for sure, or just a question not easy to answer for a bot.

本文标签: phpHow could I stop spam if my form is using ajax submit method (with no reload)Stack Overflow