Question

我正在使用jQuery webcam插件从网络摄像头捕获图像。我按顺序编写了所有脚本文件。此按钮用于进行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)

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

Answer 1

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

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

此外，作为Mritunjay suggested in the comments，请确保$("#cam-space").webcam()语句包含在$(document).ready(function() { });中。

Javascript函数第二次执行

1 个答案: