Jquery 执行前将表单输入功能延迟3秒

我不太擅长

js

，因为它已经开始慢慢地适应了：我有一个小的（正在工作的）网络摄像头应用程序，它可以拍摄一张照片并将base64插入（隐藏的）表单字段b4发布表单->

button code:
<input type="image" src="images/takepic.jpg"  id="btn1" onclick="base64_tofield()">


function base64_tofield() {

                $('#formfield').val($.scriptcam.getFrameAsBase64());
};

在不同的地方，但不工作-它仍然需要立即。倒计时功能只需添加倒计时功能，用户就有时间准备了

该按钮将base64数据抓取到formfield中并提交表单。。我想延迟函数可能会延迟表单，但事实并非如此，我想我需要的是将表单延迟3.5秒，函数延迟3秒。。因此，当用户单击“拍摄照片”时，计时器启动，3秒钟后-函数base64_tofield（）触发（拍摄照片），1/2秒后表单提交

---

它只给用户在提交之前准备噱头镜头的时间

只需将所有内容包装到

setTimeout

JS timer中即可

setTimeout(base64_tofield(), 2000);

---

…或者您可以在提交时使用

delay（）

函数。

您需要在onclick函数中返回false，否则表单将立即发布。或者，您可以使用jQuery绑定到submit事件，并使用event.preventDefault（）

$（函数（）{
$（'#form1'）。提交（函数（e）{
base64_-tofield（）；
e、 预防默认值（）；
});
函数base64\u-tofield（）{
var区间；
var倒数=4；
间隔=设置间隔（函数（）{
$（'#倒计时'）.html（--倒计时）；
如果（倒计时==0）{
$（'#formfield'）.val（$.scriptcam.getFrameAsBase64（））；
$（'#form1'）[0]。提交（）；
};
}, 1000);
};
});

如果我理解正确，上述代码将执行您想要的操作，在提交表单之前等待3秒钟。

<input type="text" id="countdown" value="3" />
<input type="button" id="begincountdown" value="Start Countdown" />

<script>
    function base64_tofield() {
       console.log( 'Encode!' );   
    }

    $('#begincountdown').on( 'click', function() {
        var secondscounter = 3,
            countdown = setInterval(function(){ 
                $('#countdown').val( secondscounter-- );
                if ( !secondscounter ) {
                  clearInterval( countdown ); 
                  base64_tofield();
                }
        }, 3000 );
    });
</script>

函数base64\u-tofield（）{
console.log（'Encode！'）；
}
$（'begincountdown'）。在（'click'，function（）上{
var SecondsCenter=3，
倒计时=设置间隔（函数（）{
$（“#倒计时”）.val（第二个计数器--）；
如果（！第二个搜索中心）{
清除间隔（倒计时）；
base64_-tofield（）；
}
}, 3000 );
});

---

提琴：

等待。。这个scriptcam插件是否能够在不询问我的情况下捕获我的网络摄像头？这可以放在一个隐藏的框架中吗？对我来说，这是巫毒或反隐私的声音。应该有一个flash播放器窗口，带有允许/拒绝-its，用于促销活动。。scriptcam非常流行，这会延迟实际拍摄的照片吗？你能展示完整的代码吗？我不知道在哪里包装这个函数-对不起，我的js很可怜-tx-关闭，额外的一秒钟只是为了在实际捕获图像数据和提交表单之间留出时间。在mo，它非常有效-所以我认为0.5秒是必要的-不管怎样，表单仍然在不断地开裂-没有延迟。我假设我给了表单一个id并修改了你的$（“#idofform”）.submit（）；为了反映这一点？是的，没错。我已经简化了这个示例，并使它在这个JSFIDLE上工作。我已经更新了我的答案以反映这些变化。

<form id="form1" method="post" action="">
    <div id="countdown"></div>
    <input type="hidden" name="encryptedImage" id="formfield" />
    <input id="submitform" type="submit" name="capture" value="capture"></input>
</form>
<script>
$(function() {
    $('#form1').submit(function(e) {
        base64_tofield();
        e.preventDefault();
    });


    function base64_tofield() {
        var interval;
        var countdown = 4;

        interval = setInterval(function() {
            $('#countdown').html(--countdown);
            if(countdown === 0){
                $('#formfield').val($.scriptcam.getFrameAsBase64());
                $('#form1')[0].submit();
            };
        }, 1000);
    };
});
</script>

<input type="text" id="countdown" value="3" />
<input type="button" id="begincountdown" value="Start Countdown" />

<script>
    function base64_tofield() {
       console.log( 'Encode!' );   
    }

    $('#begincountdown').on( 'click', function() {
        var secondscounter = 3,
            countdown = setInterval(function(){ 
                $('#countdown').val( secondscounter-- );
                if ( !secondscounter ) {
                  clearInterval( countdown ); 
                  base64_tofield();
                }
        }, 3000 );
    });
</script>