语法错误:
语法错误,也被称为解析错误,在编译时进行传统的编程语言,并出现在JavaScript解释时。
例如,下面一行将导致一个语法错误,因为它缺少一个右括号:
[js] view plaincopyprint?
<script type="text/javascript">
<!--
window.print(
//-->
</script>
[js] view plaincopyprint?
<script type="text/javascript">
<!--
window.print(
//-->
</script>
当一个语法错误在JavaScript中出现,只有在同一个线程中包含的语法错误的影响,在其他线程的代码被执行;代码依赖于包含错误的代码不会被执行。
运行时错误:
执行(编译/解释后)在运行时错误,也被称为异常,会引发。
例如,下面一行将导致运行时错误,因为这里的语法是正确的,但在运行时它正试图调用非存在的方法:
[js] view plaincopyprint?
<script type="text/javascript">
<!--
window.printme()
//-->
</script>
[js] view plaincopyprint?
<script type="text/javascript">
<!--
window.printme()
//-->
</script>
例外情况也影响到它们发生的线程,允许其他JavaScript线程继续正常执行。
逻辑错误:
逻辑错误可能是最困难的类型的错误跟踪。这些错误是不是一个语法或运行时错误的结果。相反,当发生一个错误的驱动脚本逻辑,你没有得到所期望的结果。
你可能无法抓到这些错误,因为这取决于程序是什么类型的逻辑是基于业务需求。
try...catch...finally 语句:
JavaScript的最新版本中添加的异常处理能力。JavaScript实现 try ... catch... finally结构以及抛出操作来处理异常。
你可以捕获程序员生成和运行时异常,但不能捕获JavaScript语法错误。
这里是 try...catch...finally 块语法:
[js] view plaincopyprint?
<script type="text/javascript">
<!--
try {
// Code to run
[break]
} catch ( e ) {
// Code to run if an exception occurs
[break]
}[ finally {
// Code that is always executed regardless of
// an exception occurring
}]
//-->
</script>
try块必须后跟只有一个catch块或者一个finally块(或两者之一)。当一个异常在try块时,除被放置在e和catch块被执行。 try/catch语句后的可选finally块无条件地执行。
示例:
下面是一个例子,我们正试图调用一个不存在的函数,这将引发异常。让我们来看看它的行为,不具有try ... catch:
[js] view plaincopyprint?
<html>
<head>
<script type="text/javascript">
<!--
function myFunc()
{
var a = 100
alert("Value of variable a is : " + a )
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" οnclick="myFunc()" />
</form>
</body>
</html>
现在,让我们尝试使用 try ... catch 捕获这个异常,并显示一个用户友好的消息。也可以取消此消息,如果要隐藏从用户这个错误。
[js] view plaincopyprint?
<html>
<head>
<script type="text/javascript">
<!--
function myFunc()
{
var a = 100
try {
alert("Value of variable a is : " + a )
} catch ( e ) {
alert("Error: " + e.description )
}
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" οnclick="myFunc()" />
</form>
</body>
</html>
可以使用finally块将永远try/catch语句后,无条件地执行。下面是一个例子:
[js] view plaincopyprint
<html>
<head>
<script type="text/javascript">
<!--
function myFunc()
{
var a = 100
try {
alert("Value of variable a is : " + a )
}catch ( e ) {
alert("Error: " + e.description )
}finally {
alert("Finally block will always execute!" )
}
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" οnclick="myFunc()" />
</form>
</body>
</html>
throw 语句:
可以使用throw语句来提高你的内置异常或自定义异常。后来这些异常可以被捕获并可以采取适当的行动。
以下是表示throw语句的用法的例子。
[js] view plaincopyprint
<html>
<head>
<script type="text/javascript">
<!--
function myFunc()
{
var a = 100
var b = 0
try{
if ( b == 0 ){
throw( "Divide by zero error." )
}else{
var c = a / b
}
}catch ( e ) {
alert("Error: " + e )
}
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" οnclick="myFunc()" />
</form>
</body>
</html>
您可以使用字符串,整数,布尔或对象在一个函数抛出一个异常,那么可以捕捉例外在相同的函数,我们在上面做了,或者使用try ... catch块在其他的函数。
onerror() 语法
onerror事件处理程序是第一个特点,方便JavaScript处理错误。错误事件被触发窗口对象,每当一个异常页面上出现。例如:
[js] view plaincopyprint
<html>
<head>
<script type="text/javascript">
<!--
window.onerror = function () {
alert("An error occurred.")
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" οnclick="myFunc()" />
</form>
</body>
</html>
onerror事件处理程序提供了三条信息,以找出错误的确切性质:
错误消息 . 浏览器将显示给定的错误相同的消息
URL . 在发生错误的文件
行号. 在导致错误的URL给出的行号
这里是例子来说明如何提取此信息
[js] view plaincopyprint
<html>
<head>
<script type="text/javascript">
<!--
window.onerror = function (msg, url, line) {
alert("Message : " + msg )
alert("url : " + url )
alert("Line number : " + line )
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" οnclick="myFunc()" />
</form>
</body>
</html>
可以显示在任何方式,你觉得这是更好的提取信息。
可以使用onError方法来显示错误消息的情况下没有在如下加载图像的任何问题:
[js] view plaincopyprint?
<img src="myimage.gif"
οnerrοr="alert('An error occurred loading the image.')" />
[js] view plaincopyprint
<img src="myimage.gif"
οnerrοr="alert('An error occurred loading the image.')" />
可以使用的onerror许多HTML标记错误的情况下显示相应的信息。
详解1000+项目数据分析出来的10大JavaScript错误
10个用Console来Debug的高级技巧
有浏览器的地方就有Fundebug
Debug前端HTML/CSS
转载于:https://www.cnblogs.com/curationFE/p/handle_javascript_exception.html
相关资源:javascript容错处理代码(屏蔽js错误)_js容错处理-其它代码类资源...
原文链接:http://www.cnblogs.com/curationFE/p/handle_javascript_exception.html
点击阅读全文
打开CSDN,阅读体验更佳
Vue.js中filterBy过滤器导致网页直接白屏_执笔看墨花开的博客-CSDN博 ...
一用这个方法就白屏,也没有报错,后来进vue官网一查才知道,filterBy被替换了 以前是这样的写法: <pv-for="user in users | filterBy searchQuery in 'name'">{{user.name}} 1 最新的方法:在 computed 属性中使用 js 内置方法....
继续访问
vue打包js报错问题(低版本浏览器白屏)_十梦她九的博客
在config中的webpack.base.conf.js中,修改编译配置 entry:{ app:['babel-polyfill','./src/main.js'] } 可解决开发时低版本浏览器js报错问题 方案3 使用组件问题 可能使用的组件存在问题导致打包后报错 npm update npm run build...
继续访问
mvc条码打印(使用window.print打印条码)实例
mvc条码打印(使用window.print打印条码)实例 代码: @{ Layout = "~/Views/Shared/_Layout.cshtml"var types = ViewData["types"].ToString().Trim()} <script src="@Url.Content("~/Areas/Area/AreaScripts/PrinterInWarehouse.js")" type="text/javascript"></script
继续访问
javascript中的contains方法
在研究一个多级菜单联动的js时,发现contains方法,以前没有碰到过,不知何意,然后在@司徒正美的博客发现有详细介绍,暂且摘录在此。 IE有许多好用的方法,后来都被其他浏览器抄袭了,比如这个contains方法。如果A元素包含B元素,则返回true,否则false。唯一不支持这个方法的是IE的死对头firefox。不过火狐支持compareDocumentPosition(...
继续访问
vue框架开发出现页面空白、白屏的解决方法总汇_晶晶晶晶晶的博客-CSDN...
最后build/webpack.base.conf.js 文件中配置如下: module.exports= { entry: { app: ["babel-polyfill","./src/main.js"] } }6.Vue只在iOS 10出现白屏问题 a:出现变量定义两次的错误描述,如下: SyntaxError:Cannotdeclareale...
继续访问
vue页面白屏的原因及优化_尼克_张的博客_vue 刷新页面白屏
一、原因:单页面应用的 html 是靠 js 生成,因为首屏需要加载很大的js文件(app.js vendor.js),所以当网速差的时候会产生一定程度的白屏二、解决办法:(1)优化 webpack 减少模块打包体积,code-split 按需加载(2)服务端渲染,在服务端...
继续访问
网页打印javascript:window.print()
在做B/S项目开发时。难免会遇到网页打印问题! 可以用css控制, @media print .a {display:block} .b {display:hidden} 好像是这样。把你不想打印的部分class设为b 首先在网页中添加: VIEWASTEXT>然后就可以依次加入功能按钮了: 将这两块东西放到就不会打印这些按钮了。当然要定义no
继续访问
window.print() 前端实现网页打印详解
转载: window.print() 前端实现网页打印详解_越努力,越幸运!-CSDN博客_window.print
继续访问
前端白屏出现的原因及一些解决方式_HuaHua·Li的博客
前端导致白屏的原因: JS问题 常用框架Vue React Angular都是依靠JS进行驱动, 并且单页面的应用html也是依靠JS生成,在渲染页面的时候需要加载很大的JS文件( app.js 和vendor.js ),在JS解析加载完成之前无法展示页面,从而导致了白屏(当网...
继续访问
Vue.js项目在IE11白屏报错_光脚丫思考的博客_ie11打开...
在vue.config.js里添加如下代码: configureWebpack:config=>{ config.entry.app= ['babel-polyfill','./src/main.js']}, (四)sockjs-client 还有一种情况是在i.e.打开报错显示的sockjs-client错误,如下所示: ...
继续访问
js常用方法(。。。。不完整)
lastIndexOf()substring()split()slice()splice()var s="http://www.baidu.com"var i= s.lastIndexOf(".")//16 var unit= s.substring(i)//.com var url= s.substring(0,i)//http://www.baidu ...
继续访问
详解JavaScript中的异常处理方法
当一个语法错误在JavaScript中出现,只有在同一个线程中包含的语法错误的影响,在其他线程的代码被执行;代码依赖于包含错误的代码不会被执行。 运行时错误: 执行(编译/解释后)在运行时错误,也被称为异常,会引发...
JavaScript 异常处理 详解
主要介绍了JavaScript 异常处理 详解,需要的朋友可以参考下
javascript异常处理实现原理详解
主要介绍了javascript异常处理实现原理详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
最新发布 JavaScript异常处理
JavaScript异常处理 一:异常处理 【错误类型】 Error(错误)表示系统级的错误和程序不必处理的异常,是 JavaScript 运行环境中的内部错误或者硬件问题,比如,内存资源不足等。对于这种错误,程序基本无能为力,除了退出运行外别无选择。 系统错误 程序错误 用户错用 【异常】 所谓异常,表示需要捕捉或者需要程序进行处理的地方,它处理的是因为程序设计的瑕疵而引起的问题或者在外的输入等引起的一般性问题,是程序必须处理的。 【error对象】 创建错误 let err = new Erro
继续访问
JavaScript代码异常监控实现过程详解
JavaScript异常一般有两方面:语法错误和运行时错误。两种错误的捕获和处理方式不同,从而影响具体的方案选型。通常来说,处理JS异常的方案有两种:try…catch捕获 和 [removed]捕获。以下就两种方案分别分析各自的...
webview加载页面,JS方法不能加载的问题解决
今天发现在webview,没有办法加载JS方法,跳不出那种提示框,就是写了webview.getSettings().setJavaScriptEnabled(true)这一句也完全没用。后来发现网上说的解决方案是用要用到WebChromeClient ,并且重写它里面的几个方法才行。 MyWebChromeClient.java package com.example.webview
继续访问
IE与firefox对CSS解析的差异说明
<以下摘自:草堂学社,原文路径:http://www.cm1314.cn/Article/site/ht/200704/16698.html>列举了一些常见,新手经常问的问题。举例并说明解决方法。(内容在下面对应)1.超链接访问过后hover样式就不出现的问题2.FF下如何使连续长字段自动换行3.ff下为什么父容器的高度不能自适应4. IE6的双倍边距BUG5. IE6下绝对...
继续访问
javascript错误处理方式有哪些
今天给大家分享的这篇javascript教程不是很适合初学者观看,对此不熟悉的朋友建议先看看基础的知识点。本文主要讲述java中的出错处理,也会涉及到javascript异常处理使用的正反列,以及ajax的异步处理。 Java的事件驱动机制让Java更加丰富,浏览器好比就是一个事件驱动的机器,错误也是一种事件。当一个错误发生时,一个事件就在某个点抛 出。理论上,有人会说错误是Java中的简单
继续访问
Javascript异常处理机制详解
在ES3之前js代码执行的过程中,一旦出现错误,整个js代码都会停止执行,这样就显的代码非常的不健壮。 在Java或C#等一些高级语言中,都提供了异常处理机制,可以处理出现的异常,而不会停止整个应用程序。 从ES3开始,js也提供了类似的异常处理机制,从而让js代码变的更健壮,及时执行的过程中出现了异常,也可以让程序具有了一部分的异常恢复能力。 一、Javascrip
继续访问
【JavaScript源代码】Angular处理未可知异常错误的方法详解.docx
Angular处理未可知异常错误的方法详解 代码写得再好,始终都无法完整的处理所有可能产生异常,特别是生产环境中的应用,很大一部分是数据来自用户、远程,很难保证所有数据都按程序规定的产生。事实上,除非测试...
JavaScript错误处理操作实例详解
良好的错误处理机制可以让用户得到及时的提醒,所以让我们来看看 JavaScript 提供了哪些针对错误处理的工具和方法吧O(∩_∩)O~ 1 try-catch 语句 ECMA-262 第 3 版引入了 try-catch 语句,这时 JavaScript 处理异常...
热门推荐 Javascript异常(exception)处理机制详解 JS、异常Error属性
在ES3之前js代码执行的过程中,一旦出现错误,整个js代码都会停止执行,这样就显的代码非常的不健壮。 在Java或C#等一些高级语言中,都提供了异常处理机制,可以处理出现的异常,而不会停止整个应用程序。 从ES3开始,js也提供了类似的异常处理机制,从而让js代码变的更健壮,及时执行的过程中出现了异常,也可以让程序具有了一部分的异常恢复能力。 一、Javascr
继续访问
JS高级调试技巧:捕获和分析 JavaScript Error详解
前端工程师都知道 JavaScript 有基本的异常处理能力。我们可以 throw new Error(),浏览器也会在我们调用 API 出错时抛出异常。但估计绝大多数前端工程师都没考虑过收集这些异常信息
JavaScript错误处理机制详解
从ES3开始,js也提供了类似的异常处理机制,从而让js代码变的更健壮,即使执行的过程中出现了异常,也可以让程序具有了一定的异常恢复能力。
继续访问
js异常白屏报错
把错误函数替换掉
javascript
Javascript网页打印大全普通打印(整页打) 打印网页内部分内容(自定义)打印去掉/添加页眉页脚使用外部控件/方法实现多功能打印打印背景
以上为代码控制
设置“页面设置”实现打印参数设置(Window系统图文版)
一、普通打印(整页打)
这个不用多说,直接用
引用:window.print()
二、打印网页内部分内容(自定义)
分三种方法实现
1、用css控制
引用:@media print
.a {display:block}
.b {display:hidden}
把你不想打印的部分class设为b
首先在网页中添加:
引用:<OBJECT id="WebBrowser" height="0" width="0" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"
VIEWASTEXT>
</OBJECT>
然后就可以依次加入功能按钮了:
引用:<input type="button" value="打印"><input type="button" value="直接打印">
<input type="button" value="页面设置">
<input type="button" value="打印预览"><INPUT type="button" value="关闭窗口" >
将这两块东西放到<center class=noprint></center>就不会打印这些按钮了。当然要定义noprint了:
<style media="print">.Noprint { DISPLAY: none }</style>只要把不想打印的东西的css设置成noprint就可以了。
现在就实现了基本的web打印,需要注意的情况如下:
a. 必须将ie的internet选项的安全设置中对于没有标记为安全的ActiveX控件进行...设置成提示或者启用,否则会报错,导致不可用。
b. 如果在vs.net编辑环境下编辑该页面,它经常自动的给object添加多余的参数,有了这些东西,打印就会出错,所以要记得最后保存的时候删除它们。
2、用javascript打印固定标签内的内容
a、在页面的代码头部处加入JavaScript:
引用:<script language=javascript>
function doPrint() {
bdhtml=window.document.body.innerHTML
sprnstr="<!--startprint-->"
eprnstr="<!--endprint-->"
prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17)
prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr))
window.document.body.innerHTML=prnhtml
window.print()
}
</script>
2、在页面正文处加上<!--startprint-->与<!--endprint-->标识。
也就是在需要用户打印保存的正文所对应的html处附加上。同时,如果采用小偷程序获得远程数据并需打印,可将此等数据置于该定义标签之内即可。
3、截取内容部分已完成,现在加个“打印”的链接:
XML/HTML代码
<a href="javascript:" onClick="doPrint()">打印</a>
引用:
<script language="JavaScript">
var hkey_root,hkey_path,hkey_key
hkey_root="HKEY_CURRENT_USER"
hkey_path="\\Software\\Microsoft\\Internet Explorer\\PageSetup\\"
//设置网页打印的页眉页脚为空
function pagesetup_null(){
try{
var RegWsh = new ActiveXObject("WScript.Shell")
hkey_key="header"
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"")
hkey_key="footer"
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"")
}catch(e){}
}
//设置网页打印的页眉页脚为默认值
function pagesetup_default(){
try{
var RegWsh = new ActiveXObject("WScript.Shell")
hkey_key="header"
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"&w&b页码,&p/&P")hkey_key="footer"
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"&u&b&d")
}catch(e){}
}
</script>
<input type="button" value="清空页码" onclick=pagesetup_null()>
<input type="button" value="恢复页码" onclick=pagesetup_default()>
复制出去,看下效果就可以了
(四)使用外部控件/方法实现多功能打印
1、IEWebBrowser组件
介绍
http://support.microsoft.com/default.aspx?scid=kb%3BEN-US%3BQ267240#top
http://support.microsoft.com/kb/q247671/#appliesto
代码
引用:<OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0></OBJECT>
<input name=Button onClick=document.all.WebBrowser.ExecWB(1,1) type=button value=打开>
<input name=Button onClick=document.all.WebBrowser.ExecWB(2,1) type=button value=关闭所有>
<input name=Button onClick=document.all.WebBrowser.ExecWB(4,1) type=button value=另存为>
<input name=Button onClick=document.all.WebBrowser.ExecWB(6,1) type=button value=打印>
<input name=Button onClick=document.all.WebBrowser.ExecWB(6,6) type=button value=直接打印>
<input name=Button onClick=document.all.WebBrowser.ExecWB(7,1) type=button value=打印预览>
<input name=Button onClick=document.all.WebBrowser.ExecWB(8,1) type=button value=页面设置>
<input name=Button onClick=document.all.WebBrowser.ExecWB(10,1) type=button value=属性>
<input name=Button onClick=document.all.WebBrowser.ExecWB(17,1) type=button value=全选>
<input name=Button onClick=document.all.WebBrowser.ExecWB(22,1) type=button value=刷新>
<input name=Button onClick=document.all.WebBrowser.ExecWB(45,1) type=button value=关闭>
2、使用ScriptX.cab控件
1.下载ScriptX.cab控件
官网http://www.meadroid.com/scriptx/index.asp
2.使用object元素,修改codebase,classid的值
这里调用控件ScriptX.cab
代码
引用:
<OBJECT id="factory" style="DISPLAY: none" codeBase="${rootUrl}js/smsx.cab#VVersion=6,3,435,20" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" viewastext></OBJECT>
这段代码用来加载cab文件,clsid和codebase必须要和你下载的cab中的信息对应,否则组件会加载错误,这两项其实不难找,只要你用winrar打开你下载的cab文件,然后找到扩展名是.inf的文件,然后打开之,就能看到了。
3.调用控件脚本
Print.js文件
代码
引用:
function setPrintBase(headerText,footerText,rootUrl) {
// -- advanced features ,未曾使用过,有待确认。
//factory.printing.SetMarginMeasure(2)// measure margins in inches
//factory.SetPageRange(false, 1, 3)// need pages from 1 to 3
//factory.printing.printer = "HP DeskJet 870C"
//factory.printing.copies = 2
//factory.printing.collate = true
//factory.printing.paperSize = "A4"
//factory.printing.paperSource = "Manual feed"
var header = (headerText==null||headerText=="")?'默认页眉':headerText
var footer = (footerText==null||footerText=="")?'默认页角':footerText
factory.printing.header = "&b"+header+"&b"
factory.printing.footer = "&b"+footer
factory.printing.portrait = true
factory.printing.leftMargin =10.00
factory.printing.topMargin =10.00
factory.printing.rightMargin =10.00
factory.printing.bottomMargin =10.00
}
例子
引用:
<html>
<head>
<meta http-equiv="imagetoolbar" c>
<script language="javascript" src="print.js"></script>
<style media="print">
.Noprint {DISPLAY: none}
</style>
<title>打印测试</title>
</head>
<OBJECT id="factory" style="DISPLAY: none" codeBase="smsx.cab#VVersion=6,3,435,20" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" viewastext></OBJECT>
<script defer>
function window.onload() {
setPrintBase('页眉','页脚')
}
</script>
<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0">
<center class="Noprint">
<input type=button value="打印" >
<input type=button value="页面设置" >
<input type=button value="打印预览" >
<input type="button" value="关闭" >
</center>
<center>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td align="center"><b>内容</b></td></tr>
</table>
</center>
</body>
</html>
(五)打印背景
默认情况下,使用IE浏览器打印网页时,不打印网页背景。如果需要打印网页背景,可以采用如下的方法设置:
1. 启动IE浏览器。
2. 选择【工具】菜单中的【Internet选项】菜单项,打开【Internet选项】对话框。
3. 打开【高级】选项卡,在【打印】选区中选择【打印背景颜色和图像】复选框。
4. 单击【确定】按钮,关闭对话框。
(六)如何用IE打印网页
Internet Explorer(简称IE)5.0以上版本强大的打印及打印预览功能。本文就向大家介绍如何用IE来打印网页。(谁?谁?谁在扔西红柿?下面一片嘘声:这还用得着你讲呀?!)咳咳咳,是的是的,在IE中打印网页实在是太简单不过了。只需点一下工具栏上“打印”按钮就可将当前网页打印出来。如下图所示:
不过,你这样打出来的效果怎么样呢?我就不敢说了。我今天要和大家讲的就是一些打印方面的设置参数。如何大家把这些参数设置好,你就会发现IE的打印功能快追得上Word了。今后你打印网页时就可以想怎么打就怎么打了。好,闲话少说,现在就跟我来一起看看怎么样设置IE的打印参数。
我们以下图要打印的学生名单(《学生学籍管理系统MX》查询结果网页)为例,讲解如何设置这些打印参数:
假如我们直接点工具栏的“打印”按钮或点“文件”菜单中的“打印”进行打印这个网页的话,就会打印出很多不必要的信息。所以在打印前我们应先用IE5新增的“打印预览”功能查看当前网页的实际打印效果。如下图所示:
在如下图所示的“打印预览”对话框中,我们可以看到,网页标题、网页的URL地址及打印日期等我们所不需要的信息也被打印出来了。而页码又在右上角,能不能把它移到其他位置(如我们常见的右下角)呢?
能不能按照我们所想要的样式来打印网页呢?当然可以。一切就在“页面设置”中。
弹出如下图所示的“页面设置”对话框,所有的秘密都在这里!
原来,IE自动给我们在页眉和页脚处加上了这些不必要的打印信息。如果我们不想要任何页眉和页脚的话,直接删除它们就行了。:-)大部分时候我都是这样做的。但如果你想自定义页眉和页脚的时候,该怎么做呢?上面的那些“&w&b&p”等等究竟表示什么意思呀?给你个表格就知道了。 含义
&w 网页标题
&u 网页地址 (URL)
&d 短日期格式(由“控制面板”中的“区域设置”指定)
&D 长日期格式(由“控制面板”中的“区域设置”指定)
&t 由“控制面板”中的“区域设置”指定的时间格式
&T 24 小时时间格式
&p 当前页码
&P 总页数
&b 文本右对齐(请把要右对齐的文字放在“&b”之后)
&b&b 文字居中(请把要居中的文字放在“&b”和“&b” 之间)
&&单个 &号 (&)
注:1、这些符号可以与文字组合使用,如本教程中的“页码,&p/&P”。
2、页眉和页脚默认是左对齐的,所以IE只提供了右对齐和居中的设置符号。
3、推荐给大家一种设置方法:页眉为空,页脚设为“&b第 &p 页 / 共 &P 页&b”,打印效果为在页脚居中显示“第 1 页 / 共 4 页”的效果。
知道了上面的知识,你就可以打印了。但有时你会发现,网页中的一些图像在打印时不见了。Why?为什么会这样?别着急,IE的默认设置是不打印网页的背景颜色和图像的。您只需进入IE的Internet选项将它选中(打上勾)就行了。具体操作方法是:点IE的主菜单中的“工具”——“Internet选项”——再在弹出的对话框中占击“高级”选项卡,找到“打印背景颜色和图像”一项。如下图所示:
然后将上图中红色圈住的选项打上勾,再点“确定”就OK了。
至此,我们就完成了对IE的打印设置。接下来,只要我们没有关闭IE,我们就可以一直使用上述设置(最后一项“打印背景颜色和图像”的更改始终有效)进行打印。打印前一般先进行打印预览,效果满意后再开始打印。
3、windows自带功能
按住鼠标的左键,将你想要打印的内容选定,然后单击右键选择“打印”,在弹出的打印对话框中的“页面范围”中选择“选定范围”就可以只打印你选择的内容了。
对JS的打印方法总结一下,方便日后查阅。一.用JS自带函数打印
直接调用
Java代码 复制代码
1. <a href="javascript:window.print()">打印</a>
<a href="javascript:window.print()">打印</a>
二.IEWebBrowser组件
介绍
http://support.microsoft.com/default.aspx?scid=kb%3BEN-US%3BQ267240#top
http://support.microsoft.com/kb/q247671/#appliesto
Java代码 复制代码
1. <OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0></OBJECT>
2. <input name=Button onClick=document.all.WebBrowser.ExecWB(1,1) type=button value=打开>
3. <input name=Button onClick=document.all.WebBrowser.ExecWB(2,1) type=button value=关闭所有>
4. <input name=Button onClick=document.all.WebBrowser.ExecWB(4,1) type=button value=另存为>
5. <input name=Button onClick=document.all.WebBrowser.ExecWB(6,1) type=button value=打印>
6. <input name=Button onClick=document.all.WebBrowser.ExecWB(6,6) type=button value=直接打印>
7. <input name=Button onClick=document.all.WebBrowser.ExecWB(7,1) type=button value=打印预览>
8. <input name=Button onClick=document.all.WebBrowser.ExecWB(8,1) type=button value=页面设置>
9. <input name=Button onClick=document.all.WebBrowser.ExecWB(10,1) type=button value=属性>
10. <input name=Button onClick=document.all.WebBrowser.ExecWB(17,1) type=button value=全选>
11. <input name=Button onClick=document.all.WebBrowser.ExecWB(22,1) type=button value=刷新>
12. <input name=Button onClick=document.all.WebBrowser.ExecWB(45,1) type=button value=关闭>
<OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0></OBJECT>
<input name=Button onClick=document.all.WebBrowser.ExecWB(1,1) type=button value=打开>
<input name=Button onClick=document.all.WebBrowser.ExecWB(2,1) type=button value=关闭所有>
<input name=Button onClick=document.all.WebBrowser.ExecWB(4,1) type=button value=另存为>
<input name=Button onClick=document.all.WebBrowser.ExecWB(6,1) type=button value=打印>
<input name=Button onClick=document.all.WebBrowser.ExecWB(6,6) type=button value=直接打印>
<input name=Button onClick=document.all.WebBrowser.ExecWB(7,1) type=button value=打印预览>
<input name=Button onClick=document.all.WebBrowser.ExecWB(8,1) type=button value=页面设置>
<input name=Button onClick=document.all.WebBrowser.ExecWB(10,1) type=button value=属性>
<input name=Button onClick=document.all.WebBrowser.ExecWB(17,1) type=button value=全选>
<input name=Button onClick=document.all.WebBrowser.ExecWB(22,1) type=button value=刷新>
<input name=Button onClick=document.all.WebBrowser.ExecWB(45,1) type=button value=关闭>
三.使用ScriptX.cab控件
1.下载ScriptX.cab控件
官网http://www.meadroid.com/scriptx/index.asp
2.使用object元素,修改codebase,classid的值
这里调用控件ScriptX.cab
Java代码 复制代码
1. <OBJECT id="factory" style="DISPLAY: none" codeBase="${rootUrl}js/smsx.cab#VVersion=6,3,435,20" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" viewastext></OBJECT>
<OBJECT id="factory" style="DISPLAY: none" codeBase="${rootUrl}js/smsx.cab#VVersion=6,3,435,20" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" viewastext></OBJECT>
这段代码用来加载cab文件,clsid和codebase必须要和你下载的cab中的信息对应,否则组件会加载错误,这两项其实不难找,只要你用winrar打开你下载的cab文件,然后找到扩展名是.inf的文件,然后打开之,就能看到了。
3.调用控件脚本
Print.js文件
Java代码 复制代码
1. function setPrintBase(headerText,footerText,rootUrl) {
2.
3. // -- advanced features ,未曾使用过,有待确认。
4.
5. //factory.printing.SetMarginMeasure(2)// measure margins in inches
6.
7. //factory.SetPageRange(false, 1, 3)// need pages from 1 to 3
8.
9. //factory.printing.printer = "HP DeskJet 870C"
10.
11. //factory.printing.copies = 2
12.
13. //factory.printing.collate = true
14.
15. //factory.printing.paperSize = "A4"
16.
17. //factory.printing.paperSource = "Manual feed"
18.
19. var header = (headerText==null||headerText=="")?'默认页眉':headerText
20.
21. var footer = (footerText==null||footerText=="")?'默认页角':footerText
22.
23. factory.printing.header = "&b"+header+"&b"
24.
25. factory.printing.footer = "&b"+footer
26.
27. factory.printing.portrait = true
28.
29. factory.printing.leftMargin =10.00
30.
31. factory.printing.topMargin =10.00
32.
33. factory.printing.rightMargin =10.00
34.
35. factory.printing.bottomMargin =10.00
36.
37. }
function setPrintBase(headerText,footerText,rootUrl) {
// -- advanced features ,未曾使用过,有待确认。
//factory.printing.SetMarginMeasure(2)// measure margins in inches
//factory.SetPageRange(false, 1, 3)// need pages from 1 to 3
//factory.printing.printer = "HP DeskJet 870C"
//factory.printing.copies = 2
//factory.printing.collate = true
//factory.printing.paperSize = "A4"
//factory.printing.paperSource = "Manual feed"
var header = (headerText==null||headerText=="")?'默认页眉':headerText
var footer = (footerText==null||footerText=="")?'默认页角':footerText
factory.printing.header = "&b"+header+"&b"
factory.printing.footer = "&b"+footer
factory.printing.portrait = true
factory.printing.leftMargin =10.00
factory.printing.topMargin =10.00
factory.printing.rightMargin =10.00
factory.printing.bottomMargin =10.00
}
例子
Java代码 复制代码
1. <%@ page contentType="text/htmlcharset=GBK"%>
2.
3. <html>
4. <head>
5. <meta http-equiv="imagetoolbar" content="no">
6. <script language="javascript" src="print.js"></script>
7. <style media="print">
8. .Noprint {DISPLAY: none}
9. </style>
10. <title>打印测试</title>
11. </head>
12. <OBJECT id="factory" style="DISPLAY: none" codeBase="smsx.cab#VVersion=6,3,435,20" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" viewastext></OBJECT>
13.
14. <script defer>
15. function window.onload() {
16. setPrintBase('页眉','页脚')
17. }
18. </script>
19. <body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0">
20. <center class="Noprint">
21. <input type=button value="打印" onclick="factory.printing.Print(true)">
22. <input type=button value="页面设置" onclick="factory.printing.PageSetup()">
23. <input type=button value="打印预览" onclick="factory.printing.Preview()">
24. <input type="button" value="关闭" onclick="window.close()">
25. </center>
26.<center>
27. <table width="100%" border="0" cellpadding="0" cellspacing="0">
28. <tr><td align="center"><b>内容</b></td></tr>
29.</table>
30. </center>
31. </body>
32. </html>
<%@ page contentType="text/htmlcharset=GBK"%>
<html>
<head>
<meta http-equiv="imagetoolbar" content="no">
<script language="javascript" src="print.js"></script>
<style media="print">
.Noprint {DISPLAY: none}
</style>
<title>打印测试</title>
</head>
<OBJECT id="factory" style="DISPLAY: none" codeBase="smsx.cab#VVersion=6,3,435,20" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" viewastext></OBJECT>
<script defer>
function window.onload() {
setPrintBase('页眉','页脚')
}
</script>
<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0">
<center class="Noprint">
<input type=button value="打印" onclick="factory.printing.Print(true)">
<input type=button value="页面设置" onclick="factory.printing.PageSetup()">
<input type=button value="打印预览" onclick="factory.printing.Preview()">
<input type="button" value="关闭" onclick="window.close()">
</center>
<center>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td align="center"><b>内容</b></td></tr>
</table>
</center>
</body>
</html>
四.对比
1.Window.print调用方便,但功能简单
2.功能更强大,但使用IEWebBrowser有时会报JS没有权限的错误。
3.ScriptX控件功能也比较强大,目前在使用这种方式。
这里的也不错啊,有打印到 word的和excel
http://hi.baidu.com/afei0211/blog/item/20523955ca8bebc2b745ae98.html
http://hi.baidu.com/hongz1125/blog/item/0152bcfd84ce1e1008244d5c.html
.NET环境下的
http://blog.csdn.net/flygoldfish/archive/2004/08/17/77208.aspx