<![CDATA[5D Home]]> http://www.5dhome.net/myblog/index.php zh-cn http://www.5dhome.net/myblog/read.php?187 <![CDATA[blank开新窗口为什么通不过W3C验证]]> 曼查罗 <34n.sam@gmail.com> Thu, 20 Dec 2007 01:39:34 +0000 http://www.5dhome.net/myblog/read.php?187
引用
"there is no attribute target for this element(in this HTML version)"


原来在HTML4.01/XHTML1.0/XHTML1.1严格DOCTYPE下，target="_blank"、target="_self"等等语法都是无效的，我们只能通过JavaScript来变通实现。

有朋友问为什么不允许使用target="_blank"？这个属性很方便啊。呵呵，不知道W3C的专家们是怎么想的，据我所知，主要是“易用性、友好性”的问题，因为老外觉得不经过用户同意，没有明确提示就打开一个新窗口是不礼貌的。先不管这个取消是否合理，我们来看看解决办法。
rel属性

HTML4.0增加了一个新属性：rel，这个属性用来说明链接和包含此链接页面的关系，以及链接打开的目标。rel有许多的属性值，比如 next、previous,、chapter、section等等。我们要使用的就是rel="externa l"属性。原来这样写的代码：
<a href="document.html" target="_blank"> 打开一个新窗口</a>


现在要写成这样：
<a href="document.html" rel="external">打开一个新窗口</a>


这是符合strict标准的方法。当然还必须配合一个javascript才有效。
javascript

完整的代码JS如下：
[codes=js]
    function externallinks() {
     if (!document.getElementsByTagName) return;
     var anchors = document.getElementsByTagName("a");
     for (var i=0; i<anchors.length; i++) {
       var anchor = anchors[i];
       if (anchor.getAttribute("href") &&
           anchor.getAttribute("rel") == "external")
         anchor.target = "_blank";
     }
    }
    window.onload = externallinks;
[/codes]
你可以把它保存成一个.js文件(比如external.js)，然后通过外部联接方法调用：
<script type="text/javascript" src="external.js"></script>
Tags - , ]]> http://www.5dhome.net/myblog/read.php?184 <![CDATA[Javascript + Css 控制tab （简单篇）]]> 曼查罗 <34n.sam@gmail.com> Thu, 01 Nov 2007 08:56:24 +0000 http://www.5dhome.net/myblog/read.php?184 [codes=js]
<!--
/* Set Tab on Style 1,2 */
function setTab(m,n){
var tli=document.getElementById("menu"+m).getElementsByTagName("li");
var mli=document.getElementById("main"+m).getElementsByTagName("ul");
for(i=0;i<tli.length;i++){
 tli[i].className=i==n?"hover":"";
 mli[i].style.display=i==n?"block":"none";
}
}

/* Set Tab on Style 3 */
var m3={0:"5D Home :: content list on tab 1",1:"5D Home :: content list on tab 2",2:"5D Home :: content list on tab 3",3:"5D Home :: content list on tab 4"}
function nowtab(m,n){
if(n!=0&&m3[0]=="")m3[0]=document.getElementById("main2").innerHTML;
document.getElementById("tip"+m).style.left=n*100+'px';
document.getElementById("main2").innerHTML=m3[n];
}
//-->
[/codes]

html代码 // 底部有演示地址

<!-- Style 1 -->
<div id="tabs0">
<ul class="menu0" id="menu0">
 <li onclick="setTab(0,0)" class="hover">tab 1</li>
 <li onclick="setTab(0,1)">tab 2</li>
 <li onclick="setTab(0,2)">tab 3</li>
 <li onclick="setTab(0,3)">tab 4</li>
</ul>
<div class="main" id="main0">
 <ul class="block"><li>5D Home :: content list on tab 1</li></ul>
 <ul><li>5D Home :: content list on tab 2</li></ul>
 <ul><li>5D Home :: content list on tab 3</li></ul>
 <ul><li>5D Home :: content list on tab 4</li></ul>
</div>
</div>
<br />
<br />


<!-- Style 1 -->
<div id="tabs1">
<div class="menu1box">
 <ul id="menu1">
  <li class="hover" onmouseover="setTab(1,0)"><a href="#">tab 1</a></li>
  <li onmouseover="setTab(1,1)"><a href="#">tab 2</a></li>
  <li onmouseover="setTab(1,2)"><a href="#">tab 3</a></li>
  <li onmouseover="setTab(1,3)"><a href="#">tab 4</a></li>
 </ul>
</div>
<div class="main1box">
 <div class="main" id="main1">
 <ul class="block"><li>5D Home :: content list on tab 1</li></ul>
 <ul><li>5D Home :: content list on tab 2</li></ul>
 <ul><li>5D Home :: content list on tab 3</li></ul>
 <ul><li>5D Home :: content list on tab 4</li></ul>
 </div>
</div>
</div>
<br />
<br />


<!-- Style 3 -->
<div id="tabs2">
<div class="menu2box">
 <div id="tip2"></div>
 <ul id="menu2">
  <li class="hover" onmouseover="nowtab(2,0)"><a href="#">tab 1</a></li>
  <li onmouseover="nowtab(2,1)"><a href="#">tab 2</a></li>
  <li onmouseover="nowtab(2,2)"><a href="#">tab 3</a></li>
  <li onmouseover="nowtab(2,3)"><a href="#">tab 4</a></li>
 </ul>
</div>
<div class="main" id="main2">
5D Home :: content list on tab 1
</div>
</div>
<br />
<br />


演示地址


Tags - , , , ]]> http://www.5dhome.net/myblog/read.php?178 <![CDATA[javascript的正则替换（入门篇）]]> 曼查罗 <34n.sam@gmail.com> Mon, 08 Oct 2007 08:17:08 +0000 http://www.5dhome.net/myblog/read.php?178
[codes=js]
<script>
function replaceStr(){
var str, reStr = "<img src='abc.gif'>";  
str = "This is test String<img src='abc.gif'>. This is test String.".replace(reStr, "");
alert(str);
return str;
}
</script>

<a href="#" onclick="replaceStr()">Click here to test</a>
[/codes]
Tags - ]]> http://www.5dhome.net/myblog/read.php?152 <![CDATA[Jquery - 茅点的动画 (Scroll To Paragraph)]]> 曼查罗 <34n.sam@gmail.com> Tue, 19 Jun 2007 04:58:09 +0000 http://www.5dhome.net/myblog/read.php?152
这个页面滚动效果效果用jquery做起来很简单，我来剖析一下

1）页面格式
原先试了<html>，发现不能工作，检查了一下发现是这个页面格式规范问题，具体为什么，不是很清楚地说，呵呵，要到w3网站好好研究研究。

<!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">


2）所需的javascript
在页面的head里面，载入2个js脚本

<script type="text/javascript" src="script/jquery.js"></script>
<script type="text/javascript" src="script/interface.js"></script>


2）html代码上的js
由于过于简单，没啥好说的

<a href="#LastParagraph" onClick="$('#LastParagraph').ScrollTo(1200); return false;">Scroll to last paragraph</a>


演示地址

演示下载


Tags - , ]]> http://www.5dhome.net/myblog/read.php?151 <![CDATA[AJAX - 多级菜单 （Jquery篇）]]> 曼查罗 <34n.sam@gmail.com> Mon, 18 Jun 2007 07:14:14 +0000 http://www.5dhome.net/myblog/read.php?151 34n.sam@gmail.com告诉我，谢谢。

总的说起来，多级菜单在纯js下真的很复杂，所以才想到了用ajax，因我比较懒。

整个ajax的多级菜单，我分为了3个文件。
1) jquery.js // 这个不是我写的，呵呵，我可没那么牛
2) demo.html // 实现多级菜单的html文件
3) makemenu.php // 菜单数据的来源

现在我来分析一下制作多级菜单的注意事项

jquery.js 这个脚本没什么好说的，我把它打包到附件里面

demo.html

<form name="myform" id="myform" class="myform">
 <p>level 1:
   <select id="menu_level_1" class="selectmenu">  // 一级菜单
     <option value="1">menu 1</option>
     <option value="2">menu 2</option>
     <option value="3">menu 3</option>
     <option value="4">menu 4</option>
                </select>
 </p>

 <p>level 2:    
   <select id="menu_level_2" class="selectmenu"> // 二级菜单
                 </select>
 </p>

 <p>level 2:    
   <select  id="menu_level_3" class="selectmenu"> // 三级菜单
                 </select>
 </p>  
</form>


在demo.html的头部的js,这个才是最重要的
[codes=js]
   <script type="text/javascript" src="script/jquery.js"></script> //载入jquery.js
   <script type="text/javascript">  
  $(document).ready(function() {
    // init 初始化
    var level_1 = $("#menu_level_1");  // 关联到的select的ID
   var level_2 = $("#menu_level_2");
   var level_3 = $("#menu_level_3");
   level_2.attr("disabled","disabled"); // 作的一个特效，数据没有载入成功时，处于屏蔽状态，并显示loading...
   level_3.attr("disabled","disabled");  
   
   level_1.change(function(){
     level_2.append("<option>loading...</option>");
     level_3.attr("disabled","disabled");
     $.ajax({
       type: "POST", //提交方式
       url: "makemenu.php", // 提交到的目的文件
       data: "level=1&menuid="+level_1.val(), //提交到php的数据
       
       success: function(msg){ // 提交并成功获得返回数据的处理
         var menu_level2_array,menu_level2_option;
         level_2.removeAttr("disabled");
         $("#menu_level_2 option").remove();  // remove option
         $("#menu_level_3 option").remove();  // remove option
         menu_level2_array = msg.split("::"); // 这里用的是直接文本获取，还没搞懂如何读取XML的格式，呵呵，有空再研究一下
         for(var i=0;i<menu_level2_array.length;i++){
           menu_level2_option = menu_level2_array[i].split(",");
           if(menu_level2_option[0] != ""){
             level_2.append("<option value='"+menu_level2_option[0]+"'>"+menu_level2_option[1]+"</option>");
           }
         }
       }
      });
   });
   
   
   level_2.change(function(){
     level_3.append("<option>loading...</option>");
     $.ajax({
       type: "POST",
       url: "makemenu.php",
       data: "level=2&menuid="+level_2.val(),
       success: function(msg){
         var menu_level3_array,menu_level3_option;
         level_3.removeAttr("disabled");
         $("#menu_level_3 option").remove();  // remove option
         menu_level3_array = msg.split("::");
         for(var i=0;i<menu_level3_array.length;i++){
           menu_level3_option = menu_level3_array[i].split(",");
           if(menu_level3_option[0] != ""){
             level_3.append("<option value='"+menu_level3_option[0]+"'>"+menu_level3_option[1]+"</option>");
           }
         }
       }
      });
   });    
   
  });
 
   </script>
[/codes]


makemenu.php
[codes=php]
<?php
$level  = $_POST['level'];
$menuid  = $_POST['menuid'];

$menu_array_1 = array( // 二级菜单元素
 1 => array(
   array("1","menu 1.1"),
   array("2","menu 1.2"),
   array("3","menu 1.3")
 ),
 
 2 => array(
   array("4","menu 2.1"),
   array("5","menu 2.2"),
   array("6","menu 2.3")
 ),
 
 3 => array(
   array("7","menu 3.1"),
   array("8","menu 3.2"),
   array("9","menu 3.3")
 )
);


$menu_array_2 = array( // 3级菜单元素
 4 => array(
   array("10","menu 2.1.1"),
   array("11","menu 2.1.2"),
   array("12","menu 2.1.3")
 ),
 
 5 => array(
   array("13","menu 2.2.1"),
   array("14","menu 2.2.2"),
   array("15","menu 2.2.3")
 ),
 
 7 => array(
   array("17","menu 3.1.1"),
   array("18","menu 3.1.2"),
   array("19","menu 3.1.3")
 )
);

switch($level){
 case "1": // 一级菜单传递数据，获得二级菜单，并将之处理成字符串
   $menu_array = $menu_array_1[$menuid];
   //print_r($menu_array);
   $data = "";
   for($i=0;$i<count($menu_array);$i++){
     $data.= $menu_array[$i][0].",".$menu_array[$i][1]."::";
   }
   break;
   
   
 case "2":// 二级菜单传递数据，获得三级菜单，并将之处理成字符串
   $menu_array = $menu_array_2[$menuid];
   //print_r($menu_array);
   $data = "";
   for($i=0;$i<count($menu_array);$i++){
     $data.= $menu_array[$i][0].",".$menu_array[$i][1]."::";
   }
   break;
   
   
 case "3": $data= "data 3";break; // 要做多少级，就做多少级，能读懂我写的js的朋友，修改起来应该没有什么大问题
 case "4": $data= "data 4";break;
}

echo $data;
?>
[/codes]


演示地址

演示下载


Tags - , , ]]> http://www.5dhome.net/myblog/read.php?147 <![CDATA[javascript calendar万年历使用实例]]> 曼查罗 <34n.sam@gmail.com> Mon, 28 May 2007 09:47:48 +0000 http://www.5dhome.net/myblog/read.php?147
head设置，将日历运行的js脚本以及css样式表装载


<script type="text/javascript" src="script/jquery-latest.pack.js"></script>
<script type="text/javascript" src="script/jquery-calendar.pack.js"></script>
<script type="text/javascript" src="script/calendar-demo.js"></script>
<style type="text/css">
   @import url(css/jquery-calendar.css);
</style>


如果要对日历进行特殊设置，jquery-calendar.css可以修改成你自己喜欢的样式，这对css的代码要有一定的基础才行。

如要修改日历的基本配置，可以修改calendar-demo.js中的代码，如下代码，及对应于页面展示的脚本

[codes=js]
$(document).ready(function () {
  popUpCal.hideCalendar();
      
  // default setting
  popUpCal.closeText = 'Close';
  popUpCal.prevText = '&lt;Prev';
  popUpCal.nextText = 'Next&gt;';
  popUpCal.currentText = 'Today';
  popUpCal.dayNames = new Array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday');
  popUpCal.monthNames = new Array('January','February','March','April','May','June','July','August','September','October','November','December');
  popUpCal.dateFormat = 'DMY/';
  popUpCal.minDate = new Date(2005, 4 - 1, 1);
  popUpCal.maxDate = new Date(2008, 4 - 1, 30);                    
                    
  $('#more div').hide();
  $('#more0').show();
  popUpCal.autoPopUp = false;
  $('.calendarButton').calendar();
  popUpCal.autoPopUp = true;
  $('.calendarFocus').calendar();

});
[/codes]

配置好后，只要在页面body中，写下如下代码，即可看到日历的效果


<div class="container">
<p>Calendar appears on focus: <input type="text" size="10" class="calendarFocus"/></p>
<p>Calendar appears via button: <input type="text" size="10" class="calendarButton"/></p>
</div>


一个是焦点事件，一个是按钮事件，估计作一般效果够用了。

演示地址

演示代码下载






Tags - ]]> http://www.5dhome.net/myblog/read.php?142 <![CDATA[文本框有内容时，复选框自动选中]]> luye <> Mon, 21 May 2007 04:57:38 +0000 http://www.5dhome.net/myblog/read.php?142 [codes=js]<script language="javascript">
function blur_func(){
 if (document.form1.textbox.value!==''){
   document.form1.cb_name.checked=true;
 }else{
   document.form1.cb_name.checked=false;
 }
}
</script>[/codes]

html 中的调用：
<form id="form1" name="form1" method="post" action="">
 <input type="checkbox" name="cb_name" value="checkbox" onclick="return blur_func();" />
 <input type="text" name="textbox"  onkeyup="return blur_func();" onchange="return blur_func();"/>
</form>


演示地址
Tags - ]]> http://www.5dhome.net/myblog/read.php?136 <![CDATA[javascript thickbox (很棒的js，展示图片及内容的特效)]]> 曼查罗 <34n.sam@gmail.com> Wed, 09 May 2007 05:09:51 +0000 http://www.5dhome.net/myblog/read.php?136
图片的演示效果，点击这里查看
相册阿，图库阿，用这种效果展示绝对cool~~

内嵌内容的演示效果，点击这里查看
长篇的文章，以前都用矛点飞来飞去，有了thickbox，再也不用为此烦恼，thickbox好，吃饭甭香！！

外部载入内容的演示效果，点击这里察看
以前常用弹出窗口，可是效果往往不好，而且常被某些浏览器屏蔽，用thickbox比弹出窗好10倍的效果，kero~kero~li~~

好似专门为thickbox打广告似的，呵呵，确实是一个不错的东西，不敢私藏，好东西大家分享~~

点击这里下载文件
Tags - ]]> http://www.5dhome.net/myblog/read.php?135 <![CDATA[javascript tooltip (网页的提示效果)]]> 曼查罗 <34n.sam@gmail.com> Wed, 09 May 2007 03:59:02 +0000 http://www.5dhome.net/myblog/read.php?135
点这里看演示效果

点这里下载演示

详细分析，请阅读全文





引用

第一步
<script language="JavaScript1.2" src="js/main.js" type="text/javascript"></script>
将此写在head中


引用

第二步
<script language="JavaScript1.2" src="js/style.js" type="text/javascript"></script>
将此写在body中, 个人建议不用这种加载的形式，可把style.js解开直接写在页面中，这有一个好处就是，如果要实现动态的效果的时候可以从数据库直接读取，对其进行替换



[codes=js]
<script type="text/javascript">
var FiltersEnabled = 1 // if your not going to use transitions or filters in any of the tips set this to 0

Text[0]=["5dhome.net","Business planning software."]
Text[1]=["","<b>SimplytheBest DHTML Scripts</b><br>A collection of the best DHTML script and Javascripts on the Web."]
Text[2]=["Right","This box is right positioned."]
Text[3]=["Center","This box is center positioned."]
Text[4]=["Left","This box is left positioned."]
Text[5]=["Float","This box is float positioned at a (10,10) coordinate, it also floats with the scrollbars so it is always static."]
Text[6]=["Fixed","This box is fixed positioned at a (150,400) coordinate."]
Text[7]=["Sticky style","This box will sticky around<br>This is useful when you want to insert a link like this <A href='http://www.5dhome.net'>PlanMagic</A>."]
Text[8]=["Keep style","This sticks around the mouse."]
Text[9]=["Left coordinate control","This box is right positioned with a 40 X coordinate."]
Text[10]=["Top coordinate control","This box is right positioned with a 50 Y coordinate."]
Text[11]=["Visual effects","This box has a Shadow and a bit of Transparency. It also has a random Transition effect applied to it."]
Text[12]=["Different style","This has a whole new style!"]
Text[13]=["","<b>PlanMagic Business Software:</b><ul><li>Business plan<li>Marketing plan<li>Financial plan<li>Construction plan<li>Bar business plan<li>Restaurant plan<li>Hotel business plan<li>Resort business plan</ul>"]


Style[0]=["white","black","#cc0000","#FFCC99","","","","","","","","","","",200,"",2,2,10,10,"","","","",""]
Style[1]=["white","black","#cc0000","#FFCC99","","","","","","","center","","","",200,"",2,2,10,10,"","","","",""]
Style[2]=["white","black","#cc0000","#FFCC99","","","","","","","left","","","",200,"",2,2,10,10,"","","","",""]
Style[3]=["white","black","#cc0000","#FFCC99","","","","","","","float","","","",200,"",2,2,10,10,"","","","",""]
Style[4]=["white","black","#cc0000","#FFCC99","","","","","","","fixed","","","",200,"",2,2,150,400,"","","","",""]
Style[5]=["white","black","#cc0000","#FFCC99","","","","","","","","sticky","","",200,"",2,2,10,10,"","","","",""]
Style[6]=["white","black","#cc0000","#FFCC99","","","","","","","","keep","","",200,"",2,2,10,10,"","","","",""]
Style[7]=["white","black","#cc0000","#FFCC99","","","","","","","","","","",200,"",2,2,40,10,"","","","",""]
Style[8]=["white","black","#cc0000","#FFCC99","","","","","","","","","","",200,"",2,2,10,50,"","","","",""]
Style[9]=["white","black","#cc0000","#FFCC99","","","","","","","","","","",200,"",2,2,10,10,51,0.5,75,"simple","gray"]
Style[10]=["white","black","black","white","","","right","","Tahoma","cursive","center","",3,4,200,20,5,10,10,0,50,1,70,"complex","gray"]
Style[11]=["white","black","#cc0000","#FFCC99","","","","","","","","","","",200,"",2,2,10,10,51,0.5,45,"simple","gray"]
Style[12]=["white","black","#cc0000","#FFCC99","","","","","","","","","","",200,"",2,2,10,10,51,1,0,"",""]

applyCssFilter()
</script>
[/codes]

引用

第三步
在body中具体使用函数
<A href="yourpage.html" onMouseOver="stm(Text[0],Style[6])" onMouseOut="htm()">Your text [0][6]</A>
<A href="yourpage.html" onMouseOver="stm(Text[0],Style[7])" onMouseOut="htm()">Your text [0][7]</A>
<A href="yourpage.html" onMouseOver="stm(Text[0],Style[8])" onMouseOut="htm()">Your text [0][8]</A>




Tags - ]]> http://www.5dhome.net/myblog/read.php?99 <![CDATA[弹出式窗口，又名popup window]]> 曼查罗 <34n.sam@gmail.com> Wed, 06 Dec 2006 09:49:05 +0000 http://www.5dhome.net/myblog/read.php?99 function MM_openBrWindow(theURL, winName, features) { //v2.0

 window.open(theURL,winName,features);

 return false;

}
[/codes]
Tags - ]]> http://www.5dhome.net/myblog/read.php?98 <![CDATA[文本标签也能提交表单]]> 曼查罗 <34n.sam@gmail.com> Wed, 06 Dec 2006 09:38:42 +0000 http://www.5dhome.net/myblog/read.php?98
<a href="#" onclick="document.formname.submit()">submit botton</a>

Tags - , ]]> http://www.5dhome.net/myblog/read.php?86 <![CDATA[javascript 刷新父窗口并关闭当前窗口]]> 曼查罗 <34n.sam@gmail.com> Fri, 17 Nov 2006 10:35:39 +0000 http://www.5dhome.net/myblog/read.php?86 <script>window.opener.location.reload();window.close();</script>
[/codes]
Tags - ]]> http://www.5dhome.net/myblog/read.php?84 <![CDATA[javascript 关于单选按钮屏蔽其他控件技巧]]> 曼查罗 <34n.sam@gmail.com> Fri, 10 Nov 2006 04:19:20 +0000 http://www.5dhome.net/myblog/read.php?84 // 写在head里面

<script>
function changeSelect(){
if(document.msgform.type_id.checked == true){
 document.msgform.userId.disabled=false;
 document.msgform.userEmail.disabled=true;
}

if(document.msgform.type_email.checked == true){
 document.msgform.userId.disabled=true;
 document.msgform.userEmail.disabled=false;
}

}
</script>
[/codes]


// 写在body里面，并在onload里面做初始化

<body onload="changeSelect();">
<form name="msgform">
 <label>
 <input name="type" id="type_id" type="radio" value="1" checked="checked" onclick="return changeSelect();" />
 </label>
 <label>
 <select name="userId">
   <option>- please select -</option>
   <option value="1">1</option>
   <option value="2">2</option>
 </select>
 <br />
 <input name="type" id="type_email" type="radio" value="2" onclick="return changeSelect();" />
 </label>
 <input name="userEmail" type="text" />
</form>
</body>


引用
>>查看演示



Tags - , ]]> http://www.5dhome.net/myblog/read.php?82 <![CDATA[控制表格属性]]> 曼查罗 <34n.sam@gmail.com> Tue, 07 Nov 2006 13:27:50 +0000 http://www.5dhome.net/myblog/read.php?82 <script language="javascript" type="text/javascript">
function changeTBg(nowColor){
   tbg.bgColor=nowColor;
}
</script>
[/codes]


<table width="50" border="0" cellspacing="0" cellpadding="0" id="tbg" border="1">
<tr>
 <td>color</td>
</tr>
</table>

<input name="b1" type="button" onClick="changeTBg('#ff6600');" value="ff6600">
<input name="b1" type="button" onClick="changeTBg('#4169E1');" value="4169E1">

Tags - , ]]> http://www.5dhome.net/myblog/read.php?81 <![CDATA[如何找出一个FORM中所有的checkbox]]> 曼查罗 <34n.sam@gmail.com> Tue, 07 Nov 2006 13:26:04 +0000 http://www.5dhome.net/myblog/read.php?81
var a = document.formName.elements;
var b = [];
for(var i=0; i<a.length; i++)
{
if(a.type=="checkbox") b[b.length] = a ;
}
alert(b.length);

[/codes]
Tags - ]]> http://www.5dhome.net/myblog/read.php?54 <![CDATA[鼠标移动到表格,背景的变化]]> 曼查罗 <34n.sam@gmail.com> Sat, 21 Oct 2006 03:44:08 +0000 http://www.5dhome.net/myblog/read.php?54 //****** 在TR处加以下代码 ******/
// 背景色
bgcolor="#A6C6E0″

// 鼠标移上去的背景色
onmouseover="javascript:style.backgroundColor='#E4EAED'"

// 鼠标移出的背景色
onmouseout="javascript:style.backgroundColor='#A6C6E0'"
[/codes]
Tags - , ]]> http://www.5dhome.net/myblog/read.php?53 <![CDATA[javascript 验证表单正则表达式]]> 曼查罗 <34n.sam@gmail.com> Sat, 21 Oct 2006 03:30:31 +0000 http://www.5dhome.net/myblog/read.php?53 //************** trim space *******************//
//name: Trim
//target: Trim left/right space
//Parameter: str
//return: (str)

function Trim(str){  
 return str.replace(/(^\s*)|(\s*$)/g,"");  
}  
[/codes]

[codes=js]
//************** check number *******************//
//name: fucCheckNUM
//target: isnumber
//Parameter: NUM
//return: is true,no false;

function fucCheckNUM(NUM){  
 var i,j,strTemp;  
 strTemp="0123456789";  
 if ( NUM.length== 0){  
   return false;  
 }  
 
 for(i=0;i<NUM.length;i++){  
　　j=strTemp.indexOf(NUM.charAt(i));  
　　if (j==-1){  
　　　return false;  
　　}  
　}  
　return true;  
}  
[/codes]

[codes=js]
//************** check String *******************//
//name: chksafe
//target: filter `!@#$%^&*()<>?:;"'{}[]+=-_&#124;\
//Parameter: strString
//return: true,false;

function chksafe(strString){  
 var myReg = /[\`\!\@\#\$\%\^\&\*\(\)\<\>\?\:\;\"\'\{\}\[\]\+\=\-\_\|\\]/;  
 if(myReg.test(strString)){  
   return true;  
 }  
 return false;  
}  
[/codes]

[codes=js]
//************** check date *******************//
//name: Date
//target: judgement Date
//Parameter: strDate
//return: 1,0;
function chkdate(strDate){  
 var strLength;  
 if (strDate != "")  
   strLength= strDate.length ;  
 else  
   strLength=0;  
     
 var tmpy="";  
 var tmpm="";  
 var tmpd="";  
 var status=0;  
 
 if ( strLength== 0){  
   return 0;  
 }  
 
 for (i=0;i<strLength;i++){  
　　if (strDate.charAt(i)== '-'){  
　　　status++;  
　　}  
 
　　if (status>2){  
     return 0;  
   }  
 
   if ((status==0) && (strDate.charAt(i)!='-')){  
     tmpy=tmpy+strDate.charAt(i)  
   }  
 
   if ((status==1) && (strDate.charAt(i)!='-')){  
     tmpm=tmpm+strDate.charAt(i)  
   }  
 
   if ((status==2) && (strDate.charAt(i)!='-')){  
     tmpd=tmpd+strDate.charAt(i)  
   }  
 }  
 
 year=new String (tmpy);  
 month=new String (tmpm);  
 day=new String (tmpd)  
   
 if ((tmpy.length!=4 ) || (tmpm.length>2) || (tmpd.length>2)){  
  //alert("Invalid format of date!");  
    return 0;  
 }  
 
 if (!((1<=month) && (12>=month) && (31>=day) && (1<=day)) ){  
  //alert ("Invalid month or day!");  
    return 0;  
 }  
 
 if (!((year % 4)==0) && (month==2) && (day==29)){  
  //alert ("This is not a leap year!");  
    return 0;  
 }  
 
 if ((month<=7) && ((month % 2)==0) && (day>=31)){  
  //alert ("This month is a small month!");  
    return 0;  
 }  
 
 if ((month>=8) && ((month % 2)==1) && (day>=31)){  
  //alert ("This month is a small month!");  
    return 0;  
 }  
 
 if ((month==2) && (day==30)){  
  //alert("The Febryary never has this day!");  
    return 0;  
 }  
 
 return 1;  
}  
[/codes]

[codes=js]
//************** isPic *******************//
//name: isPic
//target: judgement path
//Parameter: filePath
//return: true,false;

function isPic(filePath){  
 var temp;  
 var ExtList = ".jpg.gif.bmp.png";  
 var the_ext = filePath.substr(filePath.lastIndexOf(".")+1).toLowerCase();  
 if (ExtList.indexOf(the_ext)==-1){  
   return false;  
 }  
 return true;  
}  
[/codes]

[codes=js]
//************** chkWebsites *******************//
//name: chkWebsites
//target: judgement Websites
//Parameter: strWeb
//return: true,false;

function chkWebsites(strEmail) {  
 var myReg = /^(http:\/\/[a-z0-9]{1,5}\.)+([-\/a-z0-9]+\.)+[a-z0-9]{2,4}$/;  
 if(myReg.test(strEmail)) return true;  
 return false;  
}  

[/codes]

[codes=js]
//************** strlen *******************//
//name: strlen
//target: judgement length
//Parameter: str,num
//return: true,false;

function strlen(str,num){  
 if(str > num){  
   return true;  
 }  
 return false;  
}
[/codes]


Tags - ]]> http://www.5dhome.net/myblog/read.php?52 <![CDATA[超强的javascript读取xml结合生成树]]> 曼查罗 <34n.sam@gmail.com> Sat, 21 Oct 2006 03:22:37 +0000 http://www.5dhome.net/myblog/read.php?52 点击在新窗口中浏览此图片
http://www.5dhome.net/mybl...


点击这里下载文件
Tags - , ]]> http://www.5dhome.net/myblog/read.php?51 <![CDATA[javascript制作的二级菜单 [支持多种浏览器]]]> 曼查罗 <34n.sam@gmail.com> Sat, 21 Oct 2006 03:20:41 +0000 http://www.5dhome.net/myblog/read.php?51
>> 演示地址及源码
Tags - ]]> http://www.5dhome.net/myblog/read.php?50 <![CDATA[javascript图片变化效果]]> 曼查罗 <34n.sam@gmail.com> Sat, 21 Oct 2006 03:15:09 +0000 http://www.5dhome.net/myblog/read.php?50 [codes=js]

function selectedPic(id,src){  
 
   var imgObj=document.getElementById(id);  
 
   if(imgObj) imgObj.src=src;  
 
   return false;  
 
}  

[/codes]

演示效果
Tags - ]]>