2

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

“Microsoft JScript 运行时错误：Canvas 元素不支持 2d 上下文。jSignature 无法继续。”

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>
4

1 回答 1

1

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

问题：

jSignature 为插件使用画布元素。IE7-IE8 不支持canvas，导致错误。如果你查看源代码，你可以看到这个

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.")
        }
    }
}

简而言之，检查是否支持画布，否则检查后备 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 文件夹中获取文件。所需文件

  1. flashcanvas.js
  2. flashcanvas.swf

确保将两个文件放在同一个文件夹中并正确设置路径script src="path/to/flashcanvas.js"

于 2016-08-12T14:14:11.507 回答