首页 > 学技术 > 技术网文 > Web开发 > 正文

[精彩] web开发常用javascript功能性小技巧2(转)


来源 chinaunix.net 酷勤网整理

叶面禁止刷新完全
最好在pop出来的窗口里用,没工具栏的
<html>;
<head>;
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">;
</head>;
<body onkeydown="KeyDown()" onbeforeunload="location=location"
oncontextmenu="event.returnValue=false">;

<script language="Javascript">;<!--
function KeyDown(){
 if ((window.event.altKey)&&
     ((window.event.keyCode==37)||  
      (window.event.keyCode==39))){       alert("请访问我的主页");
    event.returnValue=false;
    }
 if ((event.keyCode==8)||              (event.keyCode==116)){          //屏蔽 F5 刷新键
    event.keyCode=0;
    event.returnValue=false;
    }
 if ((event.ctrlKey)&&(event.keyCode==78)){   //屏蔽 Ctrl+n
    event.returnValue=false;
    }
 if ((event.shiftKey)&&(event.keyCode==121)){ //屏蔽 shift+F10
    event.returnValue=false;
    }
 }
 </script>;
 </body>;
 </html>;

 ------------------------------------------------
两级联动菜单
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">;
<HTML>;
<HEAD>;
<TITLE>; New Document </TITLE>;
<META NAME="Generator" CONTENT="EditPlus">;
<META NAME="Author" CONTENT="">;
<META NAME="Keywords" CONTENT="">;
<META NAME="Description" CONTENT="">;
<script language="JavaScript" type="text/javascript">;
<!--
var province_ar=new Array("","学历文凭|旅游管理,工商企业管理,文秘,金融,国际贸易,会计,英语,计算机应用,法律,艺术设计","成人高教|工商企业管理,国际经济与贸易,外贸英语,计算机应用与管理,艺术设计","高教自考|饭店管理,工商企业管理,中英合作商务管理,保险,国际贸易,英语,电子商务,计算机及应用,法律,广告");

function show_province()
{
var pro_tmp=document.all.province;
for (m=pro_tmp.options.length-1;m>;0;m--)
pro_tmp.options[m]=null;

for(i=0;i<province_ar.length;i++)
{
if(province_ar!="")
{
tmp=province_ar.split("|");
pro_tmp.options=new Option(tmp[0],tmp[0]);
}
}
}
function show_city(sc)
{
var temp=document.all.city;
for (m=temp.options.length-1;m>;0;m--)
temp.options[m]=null;

if(province_ar[sc]!="")
{
tmp=province_ar[sc].split("|");
tmp=tmp[1];
tmp=tmp.split(",");
for(i=0;i<tmp.length;i++)
{
temp.options=new Option(tmp,tmp);
}
}
}
setTimeout("show_province();",20);//第一个搜索中省份城市对应
-->;
</script>;
</HEAD>;

<BODY>;
<FORM name="testform" id="testform">;
<select id=province 
     onchange=show_city(this.options.selectedIndex)>;
<OPTION value="" selected>;请选择类别</option>;
</select>;
<select id=city>;
   <OPTION value="" selected>;请选择专业</OPTION>;
</select>;
</FORM>;
</BODY>;
</HTML>;

 
--------------------------------------------------------------------------------
 
多级联动
1.多级关联菜单(一)
<BODY>;
<SELECT NAME="s1">;<option>;需要JavaScript才能正确显示</SELECT>;
<SELECT NAME="s2">;</SELECT>;
<SELECT NAME="s3">;</SELECT>;
<SELECT NAME="s4">;</SELECT>;
<SCRIPT LANGUAGE="JavaScript">;
<!--
//选择框的名字
selector = [ "s1", "s2", "s3", "s4" ];
//选择项: "名字", "值", 子选择
menu = [
"地球","1",
[
"中国","86",
 [
 "北京","BJ",
  [
  "--","1",null
  ],
 "四川","SC",
  [
  "成都","28",null,
  "乐山","",null,
  "攀枝花","",null,
  "自贡","",null,
  "德阳","",null,
  "绵阳","",null
  ]
 ],
"米国","1",
 [
 "加利福尼亚","CA",
  [
  "旧金山","1",null,
  "洛杉矶","2",null
  ],
 "华盛顿","WA",
  [
  "西雅图","seattle",null
  ]
 ]
],
"火星","2",
[
"大峡谷","86",
 [
 "小山丘","BJ",
  [
  "A地区","28",null,
  "B地区","",null,
  "C地区","",null
  ]
 ]
]
];

function wizz(level)
{
if( level == 0 )
 a = menu;
else
{
 str = "menu";
 for( i=0; i<level; i++ )
  str += "[" + (document.all[selector].selectedIndex * 3 + 2)  + "]";
 a = eval(str);
}
if( a == null ) return;
s = document.all[selector[level]];
i = s.length;
while( i >; 0 ) s.options[--i] = null;
while( i < Math.floor(a.length/3) )
 s.options = Option( a[i*3], a[i++*3+1] );
s.onchange = Function("wizz(" + (level+1) + ")");
wizz(level+1);
}
wizz(0);
//-->;
</SCRIPT>;
</BODY>;
</HTML>;

 ------------------------------------------------------------------
操作cookie
function getCookieVal (offset)
 {
 var endstr = documents.cookie.indexOf (";", offset);
 if (endstr == -1)
  endstr = documents.cookie.length;
 return unescape(documents.cookie.substring(offset, endstr));
 }
function SetCookie (name, value)
 {
 var argv = SetCookie.arguments;
 var argc = SetCookie.arguments.length;
 var expires = (2 < argc) ? argv[2] : null;
 expires = new Date("December 31, 2023");
 var path = (3 < argc) ? argv[3] : null;
 var domain = (4 < argc) ? argv[4] : null;
 var secure = (5 < argc) ? argv[5] : false;
 documents.cookie = name + "=" + escape (value) +
  ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
  ((path == null) ? "" : ("; path=" + path)) +
  ((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
 }

function GetCookie (name)
 {
 var arg = name + "=";
 var alen = arg.length;
 var clen = documents.cookie.length;
 var i = 0;
 while (i < clen)
  {
  var j = i + alen;
  if (documents.cookie.substring(i, j) == arg)
    return getCookieVal (j);
  i = documents.cookie.indexOf(" ", i) + 1;
  if (i == 0)
    break;
  }
 return null;
 }

function check_value()
 {
   uid=eval("window.document.myform.elements['fields[uid]']");
   if (uid.value.Trim()=='')
    {
      alert("抱歉,用戶名不能為空!");
      uid.focus();
      return false;
    }
   pws=eval("window.document.myform.elements['fields[pws]']");
   if (pws.value.Trim()=='')
    {
      alert("抱歉,密碼不能為空!");
      pws.focus();
      return false;
    }

   tz=eval("window.document.myform.elements['fields[tz]']");
   if (tz.value.Trim()=='')
    {
      alert("抱歉,請選擇要登錄的套帳!");
      uid.focus();
      return false;
    }
   SetCookie ("uid",uid.value );
 }
 ---------------------------------------------------------------
 树型菜单 1
1 注意在相对目录下建立文件夹 photos 和三个文件open.gif list.gif fold.gif


<%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage="error.jsp" %>;
<html>;
<head>;
<title>;Untitled Document</title>;
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />;
<script language="JavaScript1.2">;
<!--
/**
*  Based on Folding Menu Tree
*  Dynamic Drive (www.1studio.net)
*  For full source code, installation instructions,
*  100's more DHTML scripts, and Terms Of
*  Use, www.1studio.net
*
*  Updated to support arbitrarily nested lists
*  by 1studio@sina.com) 1studio 2001
*/

var head="photos/display:''"
img1=new Image()
img1.src="photos/fold.gif"
img2=new Image()
img2.src="photos/open.gif"
function change(){
  if(!document.all)
     return
  if (event.srcElement.id=="foldheader") {
     var srcIndex = event.srcElement.sourceIndex
     var nested = document.all[srcIndex+1]
     if (nested.style.display=="none") {
        nested.style.display=''
        event.srcElement.style.liststyleImage="url(photos/open.gif)"
     }
     else {
        nested.style.display="none"
        event.srcElement.style.liststyleImage="url(photos/fold.gif)"
     }
  }
}
document.onclick=change
//-->;
</script>;
<script language="JavaScript" type="text/javascript">;
<!--
   var popup = null;
   function inputorderid() {  
       popup = window.open('jspInputOrderid.jsp', '请输入订单编号','width=200,height=150,resizable=0,scrollbars=no');
   }
   function account() { 
       popup = window.open('jspAccountReceivable.jsp', '请选择客户名称','width=200,height=200,resizable=0,scrollbars=no');
   }
function oppaccount(){
popup = window.open('jspOppAccount.jsp', '请选择机会类型','width=200,height=200,resizable=0,scrollbars=no');
}
function accountcust(){ 
popup = window.open('jspAccountCust.jsp', '请选择客户地域','width=262,height=150,resizable=0,scrollbars=no');
}
function OrderAccount(){
popup = window.open('jspAccountOrder.jsp', '请选择客户及订单有效日期范围','width=200,height=200,resizable=0,scrollbars=no');

}
//-->;
</script>;
<style type="text/css">;

li {
font-family: "宋体", "新宋体";
font-size: 9pt;
line-height: 13pt;
margin-right: 5px;
cursor: hand;
}
#foldheader{
cursor:hand;
list-style-image:url(photos/fold.gif);
font-family: "宋体", "新宋体";
font-size: 10pt;
}
#foldinglist{
list-style-image:url(photos/list.gif);
font-family: "宋体", "新宋体";
font-size: 9pt;
}
BODY {
SCROLLBAR-FACE-COLOR: #6699CC;
SCROLLBAR-HIGHLIGHT-COLOR: #A6C4E1;
SCROLLBAR-SHADOW-COLOR: #A6C4E1;
SCROLLBAR-3DLIGHT-COLOR: #A6C4E1;
SCROLLBAR-ARROW-COLOR:  #A6C4E1;
SCROLLBAR-TRACK-COLOR: #A6C4E1;
SCROLLBAR-DARKSHADOW-COLOR: #A6C4E1;
}

A        { text-decoration:none; }
A:link       { text-decoration:none;  color: #000066;  }
A:visited    { text-decoration:none;  color: #000033;  }
A:hover      {
text-decoration:underline;
color: #FF0000;
}
</style>;
</head>;
<body bgcolor="#CBDCED" leftmargin="3" topmargin="0">;
<table width="100%" height="33" border="0" cellpadding="0" cellspacing="0">;
 <tr>;
   <td>;</td>;
 </tr>;
</table>;
<table width="100%" cellpadding="0" cellspacing="0" frame="void" align="left">;
 <tr>;
   <td>;
<fieldset style="width:100%" align="left">;
     <legend>;<a href="" target="_blank">;<font size="2">; JETCRM B/S2003 </font>;</a>;</legend>;
     <dl class="pt12normal">;
 <li id="foldheader">; 客户管理</li>;
 <ul id="foldinglist">;
   <li id="foldheader">; 客户管理</li>;
   <dl id="foldinglist" style="display:none">;
     <li>;<a href="customer_add.jsp" target="mainFrame">; 新建客户</a>;</li>;
     <li>;<a href="customer_query.jsp" target="mainFrame">; 客户查询</a>;</li>;
   <li>;<a href="menu.jsp#" onClick="accountcust()">; 客户统计</a>;</li>;
   </dl>;
   <li id="foldheader">; 联系人管理</li>;
   <dl id="foldinglist" style="display:none">;
     <li>;<a href="contact_add.jsp" target="mainFrame" class=black>; 新建联系人</a>;</li>;
     <li>;<a href="contact_query.jsp" target="mainFrame" class=black>; 联系人查询</a>;</li>;
   </dl>;
   <li id="foldheader">; 竞争对手管理</li>;
   <dl id="foldinglist" style="display:none">;
     <li>;<a href="adversary_add.jsp" target="mainFrame" class=black>; 新建竞争对手</a>;</li>;
     <li>;<a href="adversary_query.jsp" target="mainFrame" class=black>; 竞争对手查询</a>;</li>;
   </dl>;
 </ul>;
 <li id="foldheader">;服务管理</li>;
 <ul id="foldinglist" style="display:none">;
 <li id="foldheader">;联系历史</li>;
 <dl id="foldinglist" style="display:none">;
 <li>;<a href="ContactHistory_add.jsp" target="mainFrame" class=black>;新建联系记录</a>;</li>;
     <li>;<a href="ContactHistory_list.jsp" target="mainFrame" class="balck">;浏览联系记录</a>;</li>;
   </dl>;
   <li>; 邮件发送</li>;
   <li id="foldheader">;服务请求记录</li>;
   <dl id="foldinglist" style="display:none">;
           <li>;<a href="jsprequester_add.jsp" target="mainFrame" class=black>;新建服务请求</a>;</li>;
           <li>;<a href="showRequesterlist.jsp" target="mainFrame" class="balck">;服务请求浏览</a>;</li>;
   </dl>;
   <li id="foldheader">;客户投诉</li>;
   <dl id="foldinglist" style="display:none">;
     <li>;<a href="jspFeedback_add.jsp" target="mainFrame">;新建投诉记录</a>;</li>;
     <li>;<a href="feedback_list.jsp" target="mainFrame">;投诉查询</a>;</li>;
     <li>;投诉统计</li>;
   </dl>;
 </ul>;
 <li id="foldheader">;销售管理</li>;
 <ul id="foldinglist">;
   <li id="foldheader">; 机会管理</li>;
   <dl id="foldinglist" style="display:none">;
     <li>;<a href="jspOppMan.jsp" target="mainFrame">;新建机会</a>;</li>;
     <li>;<a href="jspOppQuery.jsp" target="mainFrame">;机会查询</a>;</li>;
     <li>;<a href="menu.jsp#" onClick="oppaccount()">;机会统计</a>;</li>;
   </dl>;
   <li id="foldheader">;定单管理</li>;
   <dl id="foldinglist" style="display:none">;
     <li>;<a href="jspNewOrder.jsp" target="mainFrame">;新建定单</a>;</li>;
     <li>;<a href="jspOrderQry.jsp" target="mainFrame">;定单查询</a>;</li>;
     <li>;<a href="jspFufilOrder.jsp" target="mainFrame">;订单履行</a>;</li>;
     <li>;<a href="jspFufilOrder.jsp" target="mainFrame">;订单履行</a>;</li>;
      <li>;<a href="menu.jsp#" onClick="OrderAccount">;订单额统计</a>;</li>;
     <li>;<a href="menu.jsp#" onClick=" inputorderid()">;履行或结案</a>;</li>;
     <li>;<a href="menu.jsp#" onClick=" account()">;应收款统计</a>;</li>;
   </dl>;
   <li id="foldheader">;报价管理</li>;
   <dl id="foldinglist" style="display:none">;
     <li>;<a href="jspQuote_add.jsp" target="mainFrame">;新建报价单</a>;</li>;
     <li>;<a href="jspQuote_list.jsp" target="mainFrame">;浏览报价单</a>;</li>;
   </dl>;
 </ul>;
 <li id="foldheader">;系统管理</li>;
 <ul id="foldinglist">;
   <li>;权限管理</li>;
     <li>;<a href="jspBaseDataInsert.jsp" target="mainFrame">;基础数据设置</a>;</li>;
 <li>;<a href="jspSetEmployee.jsp" target="mainFrame">;员工管理</a>;</li>;
 <li>;<a href="jsppurview_set.jsp" target="mainFrame">;权限设置</a>;</li>;
 </ul>;
       <li id="foldheader">;<a href="#" target="mainFrame">;重新登录</a>;</li>;
</dl>;
</fieldset>;
 </td>;
 </tr>;
 <tr>;
   <td>; </td>;
 </tr>;
</table>;
</body>;
</html>;





原文链接:http://bbs.chinaunix.net/viewthread.php?tid=266901
转载请注明作者名及原文出处



收藏本页到: