Question

我正在尝试使用javascript实现数学验证码。我用

创建了随机数

<script>
setInterval(function() {
  $('#num1').text(Math.floor(Math.random()*4)+1);
  $('#num2').text(Math.floor(Math.random()*3)+1);
}); 
</script>

然后将它们放在如下形式的某处：

<div>
<span id="num1"></span> +
<span id="num2"></span> =
<input id="captcha" type="text" />
</div>

然后验证：

$.validator.addMethod('captcha',
function(value) {
$result = ( parseInt($('#num1').val()) + parseInt($('#num2').val()) == parseInt($('#captcha').val()) ) ;
return $result;
},
'Numbers do not match, please try again.'
);

但是存在两个问题：一个是有时产生随机数，有时不产生随机数。问题是验证。我想对两个生成的数字求和，看看求和数是否等于输入数，然后返回true，但不知何故，document.getElementById（'num1'）。value不会传递生成的数字。知道如何解决这个问题吗？

更新：

var number1 = Math.floor(Math.random()*4)+1;
var number2 = Math.floor(Math.random()*3)+1;
$('#num1').text(number1);
$('#num2').text(number2);

$.validator.addMethod('captcha',
function(value) {
$result = $('#num1').text(number1).val() + $('#num2').text(number2).val() == parseInt($('#captcha').val()) ;
return $result;
},
'Numbers do not match, please try again.'
);

Answer 1

value属性不返回span等元素的文本，使用innerHTML document.getElementById("num1").innerHTML或者，如果使用jQuery $('#num1').text()。但是这种验证码很容易被破解，因为有关答案的数据是在客户端，你应该使用后端来验证输入数据。

Answer 2

我们在评论中解决了这个问题，但是如果其他人阅读了这篇文章。

如果您已将数字存储到变量中，只需将变量添加到一起，不要担心跨度的值

var number1 = Math.floor(Math.random()*4)+1;
var number2 = Math.floor(Math.random()*3)+1;
$('#num1').text(number1);
$('#num2').text(number2);

$.validator.addMethod('captcha',
function(value) {
    $result = number1 + number2 == parseInt($('#captcha').val()) ;
    return $result;
}, 'Numbers do not match, please try again.');

如何通过html id将两个随机数传递给JS中的函数？

2 个答案: