对象不支持属性或方法' jSignature

时间:2015-10-30 09:53:39

标签: jquery asp.net-mvc twitter-bootstrap kendo-ui jsignature

我在我的布局页面中包含了jquery.1.9.1。

我正在使用kendo和twitter bootstrap,所以我按照下面的脚本引用顺序。

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")

   <link href="~/Content/styles/kendo.bootstrap.min.css" rel="stylesheet" />
<link href="~/Content/styles/kendo.commonbootstrap.min.css"rel="stylesheet"/>

@*<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet" />*@
<link href="~/assets/plugins/jquery-ui/themes/base/minified/jquery-ui.min.css" rel="stylesheet" />
<link href="~/assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<link href="~/assets/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
<link href="~/assets/css/animate.min.css" rel="stylesheet" />
<link href="~/assets/css/style.min.css" rel="stylesheet" />
<link href="~/assets/css/style-responsive.min.css" rel="stylesheet" />
<link href="~/assets/css/theme/default.css" rel="stylesheet" id="theme" />

<link href="~/assets/plugins/jquery-jvectormap/jquery-jvectormap-1.2.2.css" rel="stylesheet" />
<link href="~/assets/plugins/bootstrap-datepicker/css/datepicker.css" rel="stylesheet" />
<link href="~/assets/plugins/bootstrap-datepicker/css/datepicker3.css" rel="stylesheet" />
<link href="~/assets/plugins/gritter/css/jquery.gritter.css" rel="stylesheet" />


<link href="~/assets/plugins/DataTables/css/data-table.css" rel="stylesheet" />
<script src="~/assets/plugins/pace/pace.min.js"></script>

我的身体部分布局如下

<body>
 @Scripts.Render("~/bundles/jquery")
@RenderBody()

@*@Scripts.Render("~/bundles/jquery")*@
@RenderSection("scripts", required: false)

<script src="~/assets/plugins/jquery/jquery-1.9.1.min.js"></script>
<script src="~/assets/plugins/jquery/jquery-migrate-1.1.0.min.js"></script>
<script src="~/assets/plugins/jquery-ui/ui/minified/jquery-ui.min.js"></script>
<script src="~/assets/plugins/bootstrap/js/bootstrap.min.js"></script>

<script src="~/assets/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="~/assets/plugins/jquery-cookie/jquery.cookie.js"></script>

<script src="~/assets/plugins/gritter/js/jquery.gritter.js"></script>
<script src="~/assets/plugins/flot/jquery.flot.min.js"></script>
<script src="~/assets/plugins/flot/jquery.flot.time.min.js"></script>
<script src="~/assets/plugins/flot/jquery.flot.resize.min.js"></script>
<script src="~/assets/plugins/flot/jquery.flot.pie.min.js"></script>
<script src="~/assets/plugins/sparkline/jquery.sparkline.js"></script>
<script src="~/assets/plugins/jquery-jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="~/assets/plugins/jquery-jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<script src="~/assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<script src="~/assets/js/dashboard.min.js"></script>
<script src="~/assets/js/apps.min.js"></script>

<script src="~/assets/plugins/DataTables/js/jquery.dataTables.js"></script>
<script src="~/assets/js/table-manage-default.demo.min.js"></script>

<link href="~/Content/styles/kendo.rtl.min.css" rel="stylesheet" />
<script src="~/Scripts/js/kendo.all.min.js"></script>
<script src="~/Scripts/js/kendo.web.min.js"></script>
<script src="~/Scripts/js/kendo.aspnetmvc.min.js"></script>
<script src="~/Scripts/js/kendo.timezones.min.js"></script>
<script src="~/Scripts/js/console.min.js"></script>
<script src="~/Scripts/js/prettify.min.js"></script>

整个应用程序运行正常。现在我正在尝试使用Jquery Signature

 <script>
    $(document).ready(function () {
        $("#signature").jSignature();

    })
</script>

这里得到的对象不支持属性或方法&#39; jSignature&#39;

如果我保持低于头部的Jquery引用Signature工作正常但在IE浏览器中显示JavaScript运行时错误:Bootstrap的JavaScript需要jQuery版本1.9.1或更高版本,当我点击继续签名工作正常但我的申请无效。

 <script src="~/assets/plugins/jquery/jquery-1.9.1.min.js"></script>

即使我已经包括

 <script src="~/JSignPlugins/jSignature.min.js"></script>
<script type="text/javascript" src="~/JSignPlugins/flashcanvas.js"></script>

2 个答案:

答案 0 :(得分:0)

尝试使用jSignature附带的“noconflict”JS文件:

<script src="~/JSignPlugins/jSignature.min.noconflict.js"></script>

而不是

<script src="~/JSignPlugins/jSignature.min.js"></script>

答案 1 :(得分:0)

取自jSignature网站(http://willowsystems.github.io/jSignature/#/about/),您应该拥有以下内容:

<!-- Ensure that the jQuery.js file is loaded BEFORE this -->
<!--[if lt IE 9]>
<script type="text/javascript" src="libs/flashcanvas.js"></script>
<![endif]-->
<script src="libs/jSignature.min.js"></script>
<div id="signature"></div>
<script>
    $(document).ready(function() {
        $("#signature").jSignature()
    })
</script>

jSignature库包含3个文件:

  • jSignature.min.js
  • flashcanvas.js
  • flashcanvas.swf

这些文件应位于项目的同一文件夹中。您无需引用.swf文件,因为flashcanvas.js会为您引用该文件。

此外,我建议您使用Developer Inspect视图(右键单击&gt;检查)在Google Chrome中尝试,并检查控制台日志中是否有任何错误。

与Internet Explorer相同。

我建议您修改问题以包含您尝试使用哪些版本的浏览器?即谷歌浏览器,IE8,9,10,11?