1

我正在使用jQuery 网络摄像头插件从网络摄像头捕获图像。我按顺序排列了所有脚本文件。此按钮用于capture()调用以获取网络摄像头的快照：

<input id="capture" type="submit" value="Capture my shot!" onclick="webcam.capture();" />

通过以下函数调用网络摄像头：

$("#cam-space").webcam({
    width: 560,
    height: 420,
    mode: "save",
    swffile: "javascript/jscam.swf",
    onTick: function (remain) {
        if (0 == remain) {
            jQuery("#timer-status").text("Cheese!");
        } else {
            jQuery("#timer-status").text(remain + " seconds remaining...");
        }
    },
    onSave: function () {
    },
    onCapture: function () {
        webcam.save("/capture/image");
    },
    debug: function () { },
    onLoad: function () { }
});

我的问题是，当我第一次单击该按钮时，Chrome 的调试器中出现以下错误：

Uncaught TypeError: undefined is not a function (onclick)

但是当我第二次单击它时，它会起作用并拍摄快照。可能有什么问题？

4

1 回答 1

1

webcam.capture()在网络摄像头插件完成加载之前，不会定义该函数。onclick您应该在加载插件后绑定事件侦听器，而不是在按钮上使用属性：

$("#cam-space").webcam({
    /* ... */
    onLoad: function() {
        $("#capture").on("click", webcam.capture);
    }
    /* ... */
});

此外，正如 Mritunjay在评论中建议的那样，确保您的$("#cam-space").webcam()陈述包含在$(document).ready(function() { });.

于 2014-08-17T17:25:24.443 回答