jQuery   发布时间:2022-03-30  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了jquery – 使用Jqplot的IE8打印问题大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在用IE8测试jqplot.当我尝试打印时,轴标签被偏移.我使用Andrew Bullock的Canvashack作为解决方法.( http://blog.muonlab.com/2010/06/02/getting-position-absolute-canvas-elements-to-print-correctly-in-ie/)它仍然没有解决问题.我是脚本新手.我的代码有什么问题吗?请帮忙.

谢谢,

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
<head>
 <Meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <!--[if IE]><script language="javascript" type="text/javascript" src="jqplot/dist/excanvas.min.js"></script><![endif]-->
  <link rel="stylesheet" type="text/css" href="jqplot/dist/jquery.jqplot.css" />

  <!-- BEGIN: load jquery -->
  <script language="javascript" type="text/javascript" src="jqplot/dist/jquery-1.3.2.min.js"></script>
  <!-- END: load jquery -->

  <!-- BEGIN: load jqplot -->
  <script language="javascript" type="text/javascript" src="jqplot/dist/jquery.jqplot.min.js"></script>
  <script type="text/javascript" src="jqplot/dist/plugins/jqplot.canvasTextRenderer.min.js"></script>
  <script type="text/javascript" src="jqplot/dist/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
  <script type="text/javascript" src="jqplot/dist/plugins/jqplot.canvasAxisTickRenderer.min.js"></script>
  <script type="text/javascript" src="jqplot/dist/plugins/jqplot.categoryAxisRenderer.min.js"></script>

   <!-- END: load jqplot -->
 <script language="javascript" type="text/javascript">
 (function($) {
 $.fn.CanvasHack = function() {
  var canvases = this.find('canvas').filter(function() {
   return $(this).css('position') == 'absolute';
  });

  canvases.wrap(function() {
   var canvas = $(this);
   var div = $('<div />').css({
    position: 'absolute',top: canvas.css('top'),left: canvas.css('left')
   });
   canvas.css({
    top: '0',left: '0'
   });
   return div;
  });

  return this;
 };
})(jQuery);

 </script>
</head>
  <body>     


<div class="jqPlot" id="chart1" style="height:320px; width:540px;"></div>
    <script language="javascript" type="text/javascript">
  line1=[[1,1],[1.5,2.25],[2,4],[2.5,6.25],[3,9],[3.5,12.25],[4,16]];
  line2=[25,12.5,6.25,3.125];
  xticks = [[0,'zero'],[1,'one'],'two'],'three'],'four'],[5,'five']];
  yticks = [-5,5,10,15,20,25,30];
  plot4 = $.jqplot('chart4',[line1,line2],{
   legend:{show:truE},title:'Customized Axes Ticks',grid: {BACkground:'#f3f3f3',gridLineColor:'#accf9b'},series:[
    {label:'Rising line',markerOptions:{style:'square'}},{label:'Declining line'}
   ],axes:{
    xaxis:{rendererOptions:{tickRenderer:$.jqplot.CanvasAxisTickRenderer},ticks:xticks,tickOptions:{angle: -30}
    },yaxis:{rendererOptions:{tickRenderer:$.jqplot.CanvasAxisTickRenderer},ticks:yticks,tickOptions:{formatString:'%d',angle: -30}
    }
   }
  });
 $('body').CanvasHack();
    </script>

  </body>
</html>

解决方法

你需要使用 jQuery 1.4.2

下载脚本并将链接替换为1.3.2与1.4.2.

你的代码中还有一个错误,你的div被称为“chart1”,但是你的脚本引用了“chart4”.

修复这些和你的歌唱:)

大佬总结

以上是大佬教程为你收集整理的jquery – 使用Jqplot的IE8打印问题全部内容,希望文章能够帮你解决jquery – 使用Jqplot的IE8打印问题所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。