0

我有一个用户注册表格。我需要检查用户表格填写的时间是否少于 xx 秒（5 秒）。如果少于 5 秒禁用表单提交。诸如此类的事情会禁用提交按钮单击或返回 false 或类似的东西。

我写了一些 jquery 脚本。但不能正常工作。

这是示例表格。

<form id="registerform" class="registerform" method="post"/>
   <input type="text" name="username" id="username" />
   <input type="text" name="email" id="email" />

   <input type="submit" name="submit" id="submitBtn" value="Submit" />
</form>

这是jquery脚本。

<script type=javascript>
jQuery.noConflict();
jQuery(document).ready(function ($) { 

     var typingTimer;    //timer identifier
     var doneTypingInterval = 5000;  //time in ms, 5 second for example

     var checktime = 0;

     jQuery('form#registerform').find(':input').each(function(){
        jQuery(this).keyup(function(){
            typingTimer = setTimeout(doneTyping, doneTypingInterval);
        });

        jQuery(this).keydown(function(){
            clearTimeout(typingTimer);
        });

    });



    function doneTyping () {
        checktime = typingTimer;
        return checktime;
    }

    jQuery('form#registerform').submit(function() {
        checktime = doneTyping ();
        var timerInsec = (doneTypingInterval/1000);
        if(checktime < timerInsec) {
            return false; // disable form submit
        } else {
             // if user take to fill the form more than 5 seconds, submit the form
            return true; 
        }
    });

});
</script>

我需要集成到 wordpress 注册表单。这就是我尝试的原因。如果有人对此有解决方案/解决方案，请帮助我。真的很感激。

谢谢

4

3 回答 3

1

这将禁用您的提交按钮 5 秒钟：

var submitButton = $('#submitBtn');
submitButton.prop("disabled", true);
setTimeout(function() {
   submitButton.prop("disabled", false);
}, 5000);

在线示例

您还需要确保恶意用户不会通过其他方式提交表单！确保运行服务器端验证：

if ( isset($_SESSION['last_submit_time']) ) {
    $delay  = intval($_SESSION['last_submit_time']) + 5;
    if ( time() < $delay ) {
          $_SESSION['last_submit_time'] = time();
          echo "You must wait for 5 more seconds before submitting. Timer reset.";
          exit;
    }
}
于 2013-11-03T20:14:40.443 回答
0

键入 timer 不包含 time ，而是包含当前正在滴答的计时器的 id ...并且由于 key up 将始终将其设置为某个值，因此它永远不会为 false。此外，您还可以为每个输入添加添加和重置计时器。如果您希望用户花费至少 5 秒来填写您的表单，请在 5 秒过去之前不要启用提交按钮。

function doneTyping () {
    checktime = typingTimer;//will always have a value that evaluates to true
    return checktime;
}
于 2013-11-03T20:20:46.533 回答
0

试试... HTML：

<form id="registerform" class="registerform" method="post">
    <input type="text" name="username" id="username">
    <input type="text" name="email" id="email">

    <input type="submit" name="submit" id="submit" value="Submit">
</form>

jQuery：

jQuery(document).ready(function ($) { 
    var intervalTime = 5000,
        inputID      = "#submit";



    function initialize(interval, input) { 
        intervalTime = interval;
        inputID      = input;

        jQuery(inputID).prop("disabled", true);        
        startCouting();
    }



    function startCouting() {
        setTimeout(function() {
            enableInput();
        }, intervalTime);
    }



    function enableInput() {
        jQuery(inputID).prop("disabled", false);
    };



    initialize(5000, "#submit");
});
于 2013-11-03T20:31:33.093 回答