jSignature 在 ASP.NET Web Forms 中工作，但在 MVC4 中不工作——为什么？

Question

我最近在 ASP.NET Web Forms 项目中成功使用了 jSignature 插件。我正在尝试将相同的功能添加到新的 MVC4 项目中。当我尝试运行具有 jQuery 功能的 MCV 视图时，在调试模式下，从 jSignature.min.js 文件中抛出以下错误：

"Microsoft JScript runtime error: Canvas element does not support 2d context. jSignature cannot proceed."

Web 窗体项目和 MVC4 项目运行来自同一台客户端机器，都处于调试模式，来自 Visual Studio 2010 的同一实例。

我还注意到，在 MVC4 项目中，在错误列表中，有 50 条消息引用了 jSignature.min.js 文件中定义的变量。

示例：第 35 行，第 56 列 - 'b' 已定义。

谁能告诉我是什么原因造成的，我需要做什么才能让 jSignature 在 MVC4 项目中工作？

从MVC看HMTL代码如下：

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>jSigTest</title>

    <script type="text/javascript" src="../../Scripts/jquery-1.7.1.js"></script>
    <script type="text/javascript" src="../../Scripts/jSignature.min.js"></script>
    <script type="text/javascript">


        $(document).ready(function () {
            $("#SignatureDiv").jSignature();
        });

    </script>

</head>
<body>
    <div>
        This is a jSignature Test Page.

        <div id="SignatureDiv">
        </div>        
    </div>
</body>
</html>

Answer 1

这不是 MVC 问题，这是关于未引用回退脚本和随附的 swf。这就是为什么我问你是否使用IE7-IE8.

问题：

jSignature 使用 canvas 元素作为插件。 IE7-IE8 不支持 canvas，这是导致错误的原因。如果你看source，你可以看到这个

function initializeCanvasEmulator(canvas){
    if (canvas.getContext){
        return false
    } else {
        var window = canvas.ownerDocument.parentWindow
        var FC = window.FlashCanvas ?
            canvas.ownerDocument.parentWindow.FlashCanvas :
            (
                typeof FlashCanvas === "undefined" ?
                undefined :
                FlashCanvas
            )

        if (FC) {
        //code omitted
        } else {
            throw new Error("Canvas element does not support 2d context. jSignature cannot proceed.")
        }
    }
}

简单来说，检查是否支持 canvas，否则检查后备 FC (FlashCanvas)，如果未找到则抛出错误

解析：

这就是你调用 jSignature 的方式

<!-- you load jquery somewhere above here ... -->
<!--[if lt IE 9]>
<script type="text/javascript" src="path/to/flashcanvas.js"></script>
<![endif]-->
<script src="path/to/jSignature.min.js"></script>
<div id="signature"></div>
<script>
    $(document).ready(function() {
        $("#signature").jSignature();
    });
</script>

您可以在此处找到文件：https://github.com/willowsystems/jSignature 下载文件，您将从 lib 文件夹中获取文件。所需文件

flashcanvas.js
flashcanvas.swf

务必将两个文件放在同一个文件夹中，并在script src="path/to/flashcanvas.js"

中正确设置路径

jSignature 在 ASP.NET Web Forms 中工作，但在 MVC4 中不工作——为什么？

jSignature working in ASP.NET Web Forms, but not in MVC4 - Why?

jquery

asp.net-mvc-4

jsignature