开发者社区> 技术小牛人> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

Web中常用的Javascript技巧(2)

简介:
+关注继续查看
< DOCTYPE html PUBLIC -WCDTD XHTML StrictEN httpwwwworgTRxhtmlDTDxhtml-strictdtd>

利用正则表达式限制网页表单里的文本框输入内容:


//消除图像工具栏
[/html]
<IMG SRC="mypicture.jpg" HEIGHT="100px" WIDTH="100px" GALLERYIMG="false">  
or 
<head> 
<meta http-equiv="imagetoolbar" content="no"> 
</head> 
[/html]
//取得控件得绝对位置(1)

<script language="javascript"> <br/>function getoffset(e) <br/>{ <br/> var t=e.offsetTop; <br/> var l=e.offsetLeft; <br/> while(e=e.offsetParent) <br/> { <br/> t+=e.offsetTop; <br/> l+=e.offsetLeft; <br/> } <br/> var rec = new Array(1); <br/> rec[0] = t; <br/> rec[1] = l; <br/> return rec <br/>} <br/></script> <br/>

[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
//获得控件的绝对位置(2) 


oRect = obj.getBoundingClientRect(); 
oRect.left 
oRect.


//打印分页


<p  style="page-break-after:always">page1</p>   
<p  style="page-break-after:always">page2</p>   


//设置打印

<object id="factory" style="display:none" viewastext <br/> classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" <br/> codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=5,60,0,360" <br/>></object> <br/><input type=button value=页面设置 onclick="factory.printing.PageSetup()"> <br/><input type=button value=打印预览 onclick="factory.printing.Preview()"> <br/> <br/><script language=javascript> <br/>function window.onload() <br/>{ <br/> // -- advanced features <br/> factory.printing.SetMarginMeasure(2) // measure margins in inches <br/> factory.printing.SetPageRange(false, 1, 3) // need pages from 1 to 3 <br/> factory.printing.printer = "HP DeskJet 870C" <br/> factory.printing.copies = 2 <br/> factory.printing.collate = true <br/> factory.printing.paperSize = "A4" <br/> factory.printing.paperSource = "Manual feed" <br/> // -- basic features <br/> factory.printing.header = "居左显示&b居中显示&b居右显示页码,第&p页/共&P页" <br/> factory.printing.footer = "(自定义页脚)" <br/> factory.printing.portrait = false <br/> factory.printing.leftMargin = 0.75 <br/> factory.printing.topMargin = 1.5 <br/> factory.printing.rightMargin = 0.75 <br/> factory.printing.bottomMargin = 1.5 <br/>} <br/>function Print(frame) { <br/> factory.printing.Print(true, frame) // print with prompt <br/>} <br/></script> <br/><input type=button value="打印本页" onclick="factory.printing.Print(false)"> <br/><input type=button value="页面设置" onclick="factory.printing.PageSetup()"> <br/><input type=button value="打印预览" onclick="factory.printing.Preview()"><br> <br/><a href="http://www.meadroid.com/scriptx/docs/printdoc.htm?static" target=_blank>具体使用手册,更多信息,点这里</a> <br/>

[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
//自带的打印预览 


WebBrowser.ExecWB(1,1) 打开  
Web.ExecWB(2,1) 关闭现在所有的IE窗口,并打开一个新窗口  
Web.ExecWB(4,1) 保存网页  
Web.ExecWB(6,1) 打印  
Web.ExecWB(7,1) 打印预览  
Web.ExecWB(8,1) 打印页面设置  
Web.ExecWB(10,1) 查看页面属性  
Web.ExecWB(15,1) 好像是撤销,有待确认  
Web.ExecWB(17,1) 全选  
Web.ExecWB(22,1) 刷新  
Web.ExecWB(45,1) 关闭窗体无提示  
<style media=print>  
.Noprint{display:none;}<!--用本样式在打印时隐藏非打印项目-->  
.PageNext{page-break-after: always;}<!--控制分页-->  
</style>  
<object  id="WebBrowser"  width=0  height=0  classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">     
</object>     
  
<center class="Noprint" > 
<input type=button value="http://www.blog.com.cn/打印 onclick=document.all.WebBrowser.ExecWB(6,1)>  
<input type=button value=直接打印 onclick=document.all.WebBrowser.ExecWB(6,6)>  
<input type=button value=页面设置 onclick=document.all.WebBrowser.ExecWB(8,1)>  
</p>  
<p> <input type=button value=打印预览 onclick=document.all.WebBrowser.ExecWB(7,1)>  
</center>



//去掉打印时的页眉页脚 
<script language="JavaScript"> <br/>var HKEY_Root,HKEY_Path,HKEY_Key; <br/>HKEY_Root="HKEY_CURRENT_USER"; <br/>HKEY_Path="\\Software\\Microsoft\\Internet Explorer\\PageSetup\\"; <br/>//设置网页打印的页眉页脚为空 <br/>function PageSetup_Null() <br/>{ <br/> try <br/> { <br/> var Wsh=new ActiveXObject("WScript.Shell"); <br/> HKEY_Key="header"; <br/> Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,""); <br/> HKEY_Key="footer"; <br/> Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,""); <br/> } <br/> catch(e){} <br/>} <br/>//设置网页打印的页眉页脚为默认值 <br/>function PageSetup_Default() <br/>{ <br/> try <br/> { <br/> var Wsh=new ActiveXObject("WScript.Shell"); <br/> HKEY_Key="header"; <br/> Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&w&b页码,&p/&P"); <br/> HKEY_Key="footer"; <br/> Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&u&b&d"); <br/> } <br/> catch(e){} <br/>} <br/></script> <br/><input type="button" value="清空页码" onclick=PageSetup_Null()> <br/><input type="button" value="恢复页码" onclick=PageSetup_Default()> <br/>
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
//无模式的提示框 


function modelessAlert(Msg) 

   window.showModelessDialog("javascript:alert(\""+escape(Msg)+"\");window.close();","","status:no;resizable:no;help:no;dialogHeight:height:30px;dialogHeight:40px;"); 




//下载文件 


function DownURL(strRemoteURL,strLocalURL) 

 try 
 { 
  var xmlHTTP=new ActiveXObject("Microsoft.XMLHTTP"); 
  xmlHTTP.open("Get",strRemoteURL,false); 
  xmlHTTP.send(); 
  var adodbStream=new ActiveXObject("ADODB.Stream"); 
  adodbStream.Type=1;//1=adTypeBinary 
  adodbStream.Open(); 
  adodbStream.write(xmlHTTP.responseBody); 
  adodbStream.SaveToFile(strLocalURL,2); 
  adodbStream.Close(); 
  adodbStream=null; 
  xmlHTTP=null; 
   
 } 
 catch(e) 
 { 
  window.confirm("下载URL出错!"); 
 } 
 //window.confirm("下载完成."); 



//检验连接是否有效 


function getXML(URL)  

 var xmlhttp = new ActiveXObject("microsoft.xmlhttp"); 
 xmlhttp.Open("GET",URL, false);  
 try 
 {  
  xmlhttp.Send(); 
 } 
 catch(e){} 
 finally  
 { 
  var result = xmlhttp.responseText; 
  if(result)  
  { 
   if(xmlhttp.Status==200) 
   { 
    return(true); 
   } 
   else  
   { 
    return(false); 
   } 
  } 
  else  
  { 
   return(false); 
  } 
 } 
}

 
//检查网页是否存在 


function Checkurl(http://www.blog.com.cn/URL) 

  var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
  xmlhttp.Open("GET",URL, false); 
  try 
  {  
    xmlhttp.Send();  
    var result = xmlhttp.status; 
  } 
  catch(e) {return(false); } 
  if(result==200) 
  {  
    return true; 
  } 
  xmlhttp = null; 
  return false; 
}



//禁止FSO 


1.注销组件 
regsvr32 /u scrrun.dll 
2.修改PROGID 
HKEY_CLASSES_ROOT\Scripting.FileSystemObject 
Scripting.FileSystemObject 
3.对于使用object的用户,修改HKEY_CLASSES_ROOT\Scripting. 

补充:

1、触发事伯提交表单

示例1:

<script language="javascript">
  function TJsub() {
  if(confirm('您确定要提交本表单吗?'))
  return document.form1.action ="test.php?action=set";
  frm1.submit();
  else return false;
 }
</script>

<form name="form1" method="post">
  <input type="text"  name="text1" value="测试文字1">
  <input type="text"  name="text2" value="测试文字2"  onClick="TJsub()>
  <input type="submit" name="submit1" value="提 交"">
</form>

2、onchange与onclick的事件触发

onchange大多用在下拉列表的触发事件中,重点在“改变”即触发事件。如页面的跳转等。而onclick强调“点击”,即点击即触发事件,用途广泛。

用法比较简单,就不做示例了。

3、“onblur”当焦点离开文本控件时,触发动作。它常常于自动获得焦点一起使用

4、自动获得焦点

示例4:

<body bgcolor="#FFFFFF" onload="document.form1.text2.focus()">
  <form name="form1" method="post">
    <input type="text"  name="text1" value="测试文字1">
    <input type="text"  name="text2" value="测试文字2"  onClick="TJsub()>
    <input type="submit" name="submit1" value="提 交"">
  </form>
</body>

5、回车移动焦点(onkeydown="if(event.KeyCode == 13)event.KeyCode=9")

示例5:

<form name="form1" method="post">
    <input type="text"  name="text1" value="测试文字1" onkeydown="if(event.KeyCode == 13)event.KeyCode=9">
    <input type="text"  name="text2" value="测试文字2"  onkeydown="if(event.KeyCode == 13)event.KeyCode=9">
    <input type="submit" name="submit1" value="提 交"">
  </form>

6、锁定文本框(readonly)

示例6:

<form name="form1" method="post">
    <input type="text"  name="text1" value="测试文字1" readonly>
    <input type="text"  name="text2" value="测试文字2" readonly>
    <input type="submit" name="submit1" value="提 交"">
  </form>

7、文本框中自动将小写字母转换大写

示例7:

<form name="form1" method="post">
    <input type="text"  name="text1" value="sample" style="font-variant:Small-caps" >
    <input type="text"  name="text2" style="font-variant:Small-caps" >
    <input type="submit" name="submit1" value="提 交"">
  </form>

8、当脚本将焦点定位到一个文本框后,怎么将光标定位文本框里字符串未尾

示例8:

<SCRIPT> 
function  setCaretAtEnd  (field)  { 
   if  (field.createTextRange)  { 
       var  r  =  field.createTextRange(); 
       r.moveStart('character',  field.value.length); 
       r.collapse(); 
       r.select(); 
   } 

</SCRIPT> 
<FORM  NAME="aForm"> 
<INPUT  TYPE="text"  NAME="userName"  VALUE="??文字"  ONFOCUS="setCaretAtEnd(this)" > 
<INPUT  TYPE="text"  NAME="userAge"  VALUE="??文字"  ONFOCUS="setCaretAtEnd(this)" > 
</FORM> 

本文转自 netcorner 博客园博客,原文链接:http://www.cnblogs.com/netcorner/archive/2006/11/08/2912547.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
超越Web,Javascript在物联网的应用
引子 Patrick Catanzariti 是一名Web开发工程师,最近他在 sitepoint 发表了《JavaScript Beyond the Web in 2014》,介绍了JavaScript在物联网中的应用,非常有意思。
1399 0
web前端javaScript 之 【Ajax】
ajax基础,看完会有收获,喜欢请点赞。
1907 0
从零开始学 Web 之 JavaScript(四)数组
大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程。此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注。在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目。
1111 0
从零开始学 Web 之 JavaScript(三)函数
大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程。此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注。在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目。
1321 0
从零开始学 Web 之 JavaScript(二)变量
大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程。此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注。在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目。
1236 0
【译】9个强大的JavaScript技巧
我喜欢优化!但是,如果站点无法在用户的Internet Explorer 11浏览器中运行,他们不会在乎我的优化代码。我使用Endtest来创建自动测试,并在跨浏览器的云上执行它们。
15 0
12款简化 Web 开发的 JavaScript 开发框架
  前端框架简化了开发过程中,像 Bootstrap 和 Foundation 就是前端框架的佼佼者。在这篇文章了,我们编制了一组新鲜的,实用的,可以帮助您建立高质量的 Web 应用程序的 JavaScript 框架清单。
1292 0
5723
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载