純JavaScript / jQuery / HTML驗證碼

Question

有人可以給我發一個鏈接，或者給我一個純Javascript / jQuery驗證碼的例子。 因為我可以在PHP / C＃后端看到很多例子。 但我只需要Javascript。

謝謝 ！！

Answer 1

我認為這不是一個好主意，因為如果在客戶端（js）中進行驗證，有人可以制作一個腳本來讀取正確的答案。

---

編輯

無論如何，如果你想要一個無用的驗證碼，你可以玩這個：

在jsfiddle看到 。

HTML

Pseudo-Human check.

<br/>How much is: <input type="text" id="a"/>
<br/>Answer:<input type="text" id="b"/>

<br/>
<input type="button" id="c" value="Go!"/>

JS

$(document).ready(function() {
    var n1 = Math.round(Math.random() * 10 + 1);
    var n2 = Math.round(Math.random() * 10 + 1);
    $("#a").val(n1 + " + " + n2);
    $("#c").click(function() {
        if (eval($("#a").val()) == $("#b").val()) {
            alert("Ok! You are human!");
        } else {
            alert("error");
        }
    });
});

---

編輯2 ：

我的“驗證碼”黑客：

// captcha hack
$(document).ready(function() {
     $("#b").val(eval($("#a").val()));
});

在jsfiddle看到 。

Answer 2

這沒有意義......如果沒有后端檢查，驗證碼就沒用了。 機器人不管怎么說都不使用javascript。 你所要完成的只是惹惱你的用戶。

Answer 3

查看： http ： //www.google.com/recaptcha/intro/

在這里演示： http ： //www.google.com/recaptcha/api2/demo或http://www.finalwebsites.com/demos/custom-captcha-image-script/

=========================== IN SHORT ====================

將代碼段添加到頁面以進行驗證碼：

 <script src='https://www.google.com/recaptcha/api.js'></script> <div class="g-recaptcha" data-sitekey="YOUR_KEY_1"></div> 

每當用戶完成挑戰時，都會填充一個名為g-recaptcha-response且帶有值的textArea，您將收集該值並發送以下請求進行驗證： https ： //www.google.com/recaptcha/api/siteverify？ secret = YOUR_KEY_2＆響應= TOKEN＆REMOTEIP = IPADDRESS

使用js獲取IP可能很麻煩： http ： //www.ipify.org/

Answer 4

我正在研究另一種驗證碼。 如果你只使用它的客戶端部分，假設你想在瀏覽器中顯示一些內容，那么你將擁有你想要的東西。 它不是純粹的javascript，因為它仍然使用api來獲取圖片，並且看起來很酷：D

http://photocaptcha.cu.cc

這將涉及到包括一個腳本，但如果你沒有驗證答案，它沒有多大意義;）

Answer 5

您好AlexC，您可以在客戶端驗證您的谷歌recaptcha也100％工作 ，我驗證您的谷歌recaptcha只是看下面的代碼
這個代碼在html主體：

 <div class="g-recaptcha" id="rcaptcha" style="margin-left: 90px;" data-sitekey="my_key"></div>
 <span id="captcha" style="margin-left:100px;color:red" />

這段代碼放在head部分調用get_action（this）方法表單按鈕：

function get_action(form) {

    var v = grecaptcha.getResponse();
    if(v.length == 0)
    {
        document.getElementById('captcha').innerHTML="You can't leave Captcha Code empty";
        return false;
    }
    if(v.length != 0)
    {
        document.getElementById('captcha').innerHTML="Captcha completed";
        return true; 
    }
}

Answer 6

這里有一個關於jQuery with captcha的教程; http://www.tutorialcadet.com/jquery-advanced-ajax-validation-with-captcha/

Answer 7

我寫了一個關於使用PHP和jQuery創建一個簡單的數學驗證碼的教程，所以無論是否啟用Javascript都可以使用它。 這應該很容易集成到您自己的腳本中，或者您可以按原樣使用它。 您可以下載項目，解壓縮zip文件，它開箱即用。 希望這個對你有幫助。

使用jQuery和PHP制作一個簡單的數學驗證碼http://www.sinawiwebdesign.com/blog/topics/programming/jquery-and-php-and-catcha-tutorial/

Answer 8

你想加入CAPTCHA只是因為它聽起來很怪異嗎？ 除非確實需要，否則不要使用它。