执行代码AFTER Recaptcha.reload()完成后

Dre*_*ett 6 javascript css jquery captcha recaptcha

我在下面有一个函数来调用重新加载recaptcha图像.它工作,重新加载图像,但之后不会做任何事情.基本上这个形式很小,有重复这个,所以我缩小了它,允许点击放大和所有这些.如果该人按下"获取另一个验证码"并调用reloadCAP(),则会检查它是否具有更大图像的类.如果它确实我需要它添加该类和css回到新图像加载后的元素但我似乎无法让它工作.有任何想法吗?

function reloadCAP() {
    if($("#recaptcha_widget img").hasClass('largecap')) {
        Recaptcha.reload();
        $("#recaptcha_widget img").addClass('largecap');
        $('#recaptcha_image').css('height', '62px');
    } else {
        Recaptcha.reload();
    }
}
Run Code Online (Sandbox Code Playgroud)

这是这个的HTML:

<div id="recaptcha_widget" class="formRow" style="display:none;">
    <span class="f_label">Enter Words Below:</span>
    <input type="text" class="setWidth" id="recaptcha_response_field" name="recaptcha_response_field" />

    <div class="cantread">
        <strong>Can't read this?</strong><br />
        <a href="javascript:reloadCAP()">Get another CAPTCHA</a>
    </div>

    <div id="recaptcha_image"></div> <!-- image loaded into this div -->
        <div class="clear"></div>
        <span class="smalltext">(click to enlarge)</span>

        <br clear="all" />
    </div>
<script type="text/javascript" src="http://api.recaptcha.net/challenge?k=6LfzMMwSAAAAADV6D04jDE6fKwrJ57dXwOEW-vY3&lang=en"></script>
Run Code Online (Sandbox Code Playgroud)

Gre*_*ida 3

$("#recaptcha_widget img").one('load',function(){
    $("#recaptcha_widget img").addClass('largecap');
    $('#recaptcha_image').css('height', '62px');
});
Run Code Online (Sandbox Code Playgroud)

这将在您正在重新加载的图像的加载事件上放置一个一次性侦听器,然后执行以下代码。

我使用.one()而不是在.load()这里,因为你不想每次调用时都附加一个新的侦听器reloadCAP()

编辑

好的,这就是我认为问题所在。当您调用时,Recaptcha.reload()它会删除<img />并用新的替换。因此,当我们尝试附加事件时,它会随着图像被删除而被删除。

您需要做的是将类放在divlargecaprecaptcha_image并修改您的 css 样式,使其看起来像

.largecap img {
  height: whatever;
  width: whatever;
}
Run Code Online (Sandbox Code Playgroud)