BlogJava-<h1><font color="red" size="36">︻┳═一Java</font></h1>-文章分类-HTMLhttp://www.blogjava.net/rain1102/category/14846.html<b><font color="#3C1435">08年奋斗目标：</font><font color="maroon">赚钱买个房子！</font></b>zh-cnFri, 29 Feb 2008 16:46:48 GMTFri, 29 Feb 2008 16:46:48 GMT60IE中打开UTF-8编码title为中文的网页会显示空白页的问题http://www.blogjava.net/rain1102/articles/182999.htmlEric.ZhouEric.ZhouFri, 29 Feb 2008 09:31:00 GMThttp://www.blogjava.net/rain1102/articles/182999.htmlhttp://www.blogjava.net/rain1102/comments/182999.htmlhttp://www.blogjava.net/rain1102/articles/182999.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/182999.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/182999.html   <title>标签被放在<meta>标签前面。当title为中文的时(比如Blog名为中文或者文章标题为中文)，在IE下会出现显示空白页的问题。
  
  由于 utf-8 使用3个字节表示一个汉字，而GB2312或BIG5使用两个字节。页面输出时，由于上述原因，使浏览器解析、输出<title> </title>的内容时，如果在</title>前有奇数个全角字符时，IE把 UTF-8 当作两个字节解析时出现半个汉字的情况，这时该半个汉字会和</title>的<结合成一个乱码字，导致IE无法读完<title>部分，致使整个页面为空百输出。此时查看源文件，会发现实际上整个页面全部已经下载了。
  
  而浏览器解析html的方式是：浏览器读取了页面的html代码后开始进行解析。解析前浏览器要先知道页面的编码方式，然后根据编码方式进行解码，然后才能开始解析。
  浏览器可以从下面3个方面得到页面编码方式：
  HTTP Header中的"Content-Type"项；
  返回的html代码开头是否有BOM（Byte Order Mark）；
  html代码中的meta标签。
  
  浏览器(无论是IE还是Firefox)在解析页面时，首先取HTTP Header中的Content-Type项，如果有写明charset的话就认定页面的编码方式为charset指定的值。如果没有指明，则认定为默认值。根据上表，IE中文版的默认值是GB2312，Firefox中文版的默认值是GBK，不过IE的GB2312好像和GBK没啥区别。然后，浏览器会看一下有没有BOM。一旦发现有UTF-8的3字节BOM，则重新认定页面的编码方式为UTF-8。
  
  解码阶段，解码完成后是解析html的阶段。解析html的过程中，当解析到head部分的meta标签时，浏览器会根据<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />这个语句中的说明，重新认定编码方式为charset后面的方式，中断html解析过程，返回到解码步骤重新解码。
  
  GBK 和 UTF-8 的编码范围：
  GBK的编码范围是0×8140-0xfefe。从GB2312-80开始，因为ASCII码的范围是0~127，首字位是0，所以GB2312-80使用双字节，并设置首字位为1。“GBK 亦采用双字节表示，总体编码范围为 8140-FEFE，首字节在 81-FE 之间，尾字节在 40-FE 之间。”
  
  UTF-8中中文都是3个字节的，由于Unicode中中日韩的文字都混在一起，可以使用Windows自带的字符映射表查看CJK表意字符的范围，即为汉字的范围。3字节的UTF-8编码是：1110xxxx 10xxxxxx 10xxxxxx，编码范围是8000-EFFF，首字节在80-EF之间，尾字节在00-FF之间。
  
   显然当一段UTF-8编码的文本被按照GBK方式解码的时候，由于有一些编码在GBK中不存在，造成解码程序出现错误。当UTF-8文本被按照GBK的方式解码的时候，前两个字节会被认为是一个字，后一个字节将和下一个字符结合。当<title>标签里的汉字数是偶数个时，勉强有3/4的概率通过解码程序(因为GBK的第二个字节要求是40-FE)，当有奇数个汉字的时候，最后一个汉字的三个字节的最后一个字节会和< /title>的第一个字符<结合，而<的编码是3C，正好不在尾字节40-FE的范围中，造成错误。如果< /title>标签前有多余的空格也会产生错误，因为空格的编码20也不在范围中。
  
  meta 标签的作用：详细请看 《HTML中meta的作用》
  “meta是用来在HTML文档中模拟HTTP协议的响应头报文。”在meta标签中写和在HTTP头里写是一样的，这也是为了解决用普通HTML写网页的人无法自行定义HTTP头的问题。但是，meta是一个html标签，所以必须进入到html解析的步骤才能生效，而生效后，浏览器会退回几步，重新设置好HTTP头从头再开始解码、解析html。所以meta中写的内容会覆盖HTTP头里的内容，无论哪个浏览器都是这样的。
  
  出现空白页必须的3项条件：
  1.title标签里的内容为中文其他双字节字符；
  2.指定网页编码的 meta 信息在 title 标签的下方；
  3.另存或转换utf-8编码时没有包括 unicode 签名。
  
  BOM （Byte Order Mark，字节序标识）的作用：
  用于UTF-16编码的文件，在UTF-8编码的文件中不需要标识字节序，所以被用来标识这是一个UTF-8编码文件。
  
  这个问题还是IE的兼容性问题，在解码的时候如果遇到错误的编码就中断解码。
  这个是IE的bug，不过也不要认为你用的是MyIE、MyIE2、遨游Maxthon、GreenBrowser、腾讯TT就不会受到影响。Firefox或者Opera就更不会了。
  
  解决办法：
  utf8页面应该使用标准顺序
  <meta http-equiv=”content-type” content=”text/html; charset=UTF-8″ />
  <meta http-equiv=”content-language” content=”zh-CN” />
  <meta name=”robots” content=”index,follow” />
  <meta name=”keywords” content=”" />
  <meta name=”description” content=”" />
  <meta name=”rating” content=”general” />
  <meta name=”author” content=”" />
  <meta name=”copyright” content=”" />
  <meta name=”generator” content=”" />
  <title></title>
  
  参考文章：
  http://hewei.org/website-research/shtml-utf8-bom/ shtml调用在utf8编码下多出空行的问题（解决）
  IE中打开UTF-8编码title为中文的网页会显示空白页的问题 (文中大部分是这里的观点)
    做人要厚道，请注明转自酷网动力(www.ASPCOOL.COM)。

Eric.Zhou 2008-02-29 17:31 发表评论
]]>JSP中出现According to TLD or attribute directive in tag file..http://www.blogjava.net/rain1102/articles/182143.htmlEric.ZhouEric.ZhouTue, 26 Feb 2008 01:53:00 GMThttp://www.blogjava.net/rain1102/articles/182143.htmlhttp://www.blogjava.net/rain1102/comments/182143.htmlhttp://www.blogjava.net/rain1102/articles/182143.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/182143.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/182143.html一下转帖别人博客的解决方式 http://blog.csdn.net/f9inux/archive/2006/11/05/1368428.aspx
应用部署运行的时候出现JSP异常, 发生在使用JSTL库的时候: According to TLD or attribute directive in tag file, attribute value does not accept any expressions, 可能是因为使用了JSP2.0版本, 同时又没有使用JSTL core库的备用版本(RT库), 以下有两种处理方法:

1. 修改web.xml.
<web-app xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd" version="2.4">

改为2.3版本的
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>

2. 使用JSTL core RT库

JSTL core库的有两种taglib伪指令, 其中RT库即是依赖于JSP传统的请求时属性值, 而不是依赖于EL来实现(称为EL库.JSP2.0将支持EL)

JSP中使用<%@ taglib uri=http://java.sun.com/jstl/core prefix="c"%>在2.3版本都可以,在2.4就不行了, 难道是版本不兼容吗?

只要将
<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c"%>

改为
<%@ taglib uri=http://java.sun.com/jstl/core_rt prefix="c"%>

Eric.Zhou 2008-02-26 09:53 发表评论
]]>对多列表格多种数据类型进行排序 http://www.blogjava.net/rain1102/articles/177464.htmlEric.ZhouEric.ZhouThu, 24 Jan 2008 05:08:00 GMThttp://www.blogjava.net/rain1102/articles/177464.htmlhttp://www.blogjava.net/rain1102/comments/177464.htmlhttp://www.blogjava.net/rain1102/articles/177464.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/177464.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/177464.html<html>
  <head>
    <title>Sort.html</title>
 <script type="text/javascript">
  function convert(sValue, sDataType) {
   switch (sDataType) {
    case "int":
     return parseInt(sValue);
    case "float":
     return parseFloat(sValue);
    case "date":
     return new Date(Date.parse(sValue));
    default:
     return sValue.toString();
   }
  }
 
  function generateCompareTRs(iCol, sDataType) {
   return function compareTRs(oTR1, oTR2) {
    var sValue1 = convert(oTR1.cells[iCol].firstChild.nodeValue, sDataType);
    var sValue2 = convert(oTR2.cells[iCol].firstChild.nodeValue, sDataType);
    
    //这里就不可以使用localeCompare方法了，因为数字和日期不支持它，也不可以用"=="，因为日期是对象。
    if (sValue1 < sValue2) {
     return -1;
    } else if (sValue1 > sValue2) {
     return 1;
    } else {
     return 0;
    }
   }
  }
  
  function sortTable(sTableID, iCol, sDataType) {
   var oTable = document.getElementById(sTableID);
   var oTBody = oTable.tBodies[0];
   var colDataRows = oTBody.rows;
   var aTRs = new Array;
   
   for (var i = 0; i < colDataRows.length; i++) {
    aTRs.push(colDataRows[i]);
   }
   
   if (oTable.sortCol == iCol){
    aTRs.reverse();
   } else {
    aTRs.sort(generateCompareTRs(iCol, sDataType));
   }

   var oFragment = document.createDocumentFragment();
   for (var i = 0; i < aTRs.length; i++) {
    oFragment.appendChild(aTRs[i]);
   }
   
   oTBody.appendChild(oFragment);
   oTable.sortCol = iCol;
  }
 </script>
  </head>
 
  <body>
    This is my HTML page. <br>
    <table border="1" id="tblSort">
     <thead>
      <tr>
       <th onclick="sortTable('tblSort', 0)" style="cursor:pointer">Last Name</th>
       <th onclick="sortTable('tblSort', 1)" style="cursor:pointer">First Name</th>
       <th onclick="sortTable('tblSort', 2, 'date')" style="cursor:pointer">Birthday</th>
       <th onclick="sortTable('tblSort', 3, 'int')" style="cursor:pointer">Age</th>
      </tr>
     </thead>
     <tbody>
      <tr>
       <td>Smith</td>
       <td>John</td>
       <td>7/12/1978</td>
       <td>31</td>
      </tr>
      <tr>
       <td>Johnson</td>
       <td>Betty</td>
       <td>10/15/1977</td>
       <td>32</td>
      </tr>
      <tr>
       <td>Henderson</td>
       <td>Nathan</td>
       <td>02/22/1982</td>
       <td>27</td>
      </tr>
      <tr>
       <td>Williams</td>
       <td>James</td>
       <td>8/19/1980</td>
       <td>29</td>
      </tr>
      <tr>
       <td>Gilliams</td>
       <td>Michael</td>
       <td>5/13/1972</td>
       <td>39</td>
      </tr>
      <tr>
       <td>Walker</td>
       <td>Matthew</td>
       <td>10/19/1981</td>
       <td>28</td>
      </tr>
     </tbody>
    </table>
  </body>
</html>



Eric.Zhou 2008-01-24 13:08 发表评论
]]>对多列表格进行排序http://www.blogjava.net/rain1102/articles/177457.htmlEric.ZhouEric.ZhouThu, 24 Jan 2008 04:24:00 GMThttp://www.blogjava.net/rain1102/articles/177457.htmlhttp://www.blogjava.net/rain1102/comments/177457.htmlhttp://www.blogjava.net/rain1102/articles/177457.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/177457.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/177457.html   <head>
    <title>Sort.html</title>
 <script type="text/javascript">
  function generateCompareTRs(iCol) {
   return function compareTRs(oTR1, oTR2) {
    var sValue1 = oTR1.cells[iCol].firstChild.nodeValue;
    var sValue2 = oTR2.cells[iCol].firstChild.nodeValue;
    return sValue1.localeCompare(sValue2);
   }
  }
  
  function sortTable(sTableID, iCol) {
   var oTable = document.getElementById(sTableID);
   var oTBody = oTable.tBodies[0];
   var colDataRows = oTBody.rows;
   var aTRs = new Array;
   
   for (var i = 0; i < colDataRows.length; i++) {
    aTRs.push(colDataRows[i]);
   }
   
   aTRs.sort(generateCompareTRs(iCol));
   
   var oFragment = document.createDocumentFragment();
   for (var i = 0; i < aTRs.length; i++) {
    oFragment.appendChild(aTRs[i]);
   }
   
   oTBody.appendChild(oFragment);
  }
 </script>
  </head>
 
  <body>
    This is my HTML page. <br>
    <table border="1" id="tblSort">
     <thead>
      <tr>
       <th onclick="sortTable('tblSort', 0)" style="cursor:pointer">Last Name</th>
       <th onclick="sortTable('tblSort', 1)" style="cursor:pointer">First Name</th>
      </tr>
     </thead>
     <tbody>
      <tr>
       <td>Smith</td>
       <td>John</td>
      </tr>
      <tr>
       <td>Johnson</td>
       <td>Betty</td>
      </tr>
      <tr>
       <td>Henderson</td>
       <td>Nathan</td>
      </tr>
      <tr>
       <td>Williams</td>
       <td>James</td>
      </tr>
      <tr>
       <td>Gilliams</td>
       <td>Michael</td>
      </tr>
      <tr>
       <td>Walker</td>
       <td>Matthew</td>
      </tr>
     </tbody>
    </table>
  </body>
</html>

逆序排列：
上面只对表格进行了排列，如果要实现想Microsoft Outlook那样，第一次点击是排序，如果再点击一次，将会对此列进行逆序排列。
修改以后的代码为：

function sortTable(sTableID, iCol) {
   var oTable = document.getElementById(sTableID);
   var oTBody = oTable.tBodies[0];
   var colDataRows = oTBody.rows;
   var aTRs = new Array;
   
   for (var i = 0; i < colDataRows.length; i++) {
    aTRs.push(colDataRows[i]);
   }
   
   if (oTable.sortCol == iCol){
    aTRs.reverse();
   } else {
    aTRs.sort(generateCompareTRs(iCol));
   } 
  var oFragment = document.createDocumentFragment();
   for (var i = 0; i < aTRs.length; i++) {
    oFragment.appendChild(aTRs[i]);
   }
   
   oTBody.appendChild(oFragment);
   oTable.sortCol = iCol;
  }



Eric.Zhou 2008-01-24 12:24 发表评论
]]>Form中input和textarea自动选择文本http://www.blogjava.net/rain1102/articles/177418.htmlEric.ZhouEric.ZhouThu, 24 Jan 2008 01:58:00 GMThttp://www.blogjava.net/rain1102/articles/177418.htmlhttp://www.blogjava.net/rain1102/comments/177418.htmlhttp://www.blogjava.net/rain1102/articles/177418.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/177418.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/177418.htmlFormUtil.setTextboxes = function() {
   var colInputs = document.getElementsByTagName("input");
   var colTextAreas = document.getElementsByTagName("textarea");
 
   for (var i = 0; i < colInputs.length; i++) {
      if (colInputs[i].type == "text" || colInputs[i].type == "password") {
         colInputs[i].onfocus = function() {this.select();};
      }
   }
   for (var i = 0; i < colTextAreas.length; i++) {
      colTextAreas[i].onfocus = function() {this.select();};
   }
}

Eric.Zhou 2008-01-24 09:58 发表评论
]]>自定义鼠标提示代码http://www.blogjava.net/rain1102/articles/177315.htmlEric.ZhouEric.ZhouWed, 23 Jan 2008 08:38:00 GMThttp://www.blogjava.net/rain1102/articles/177315.htmlhttp://www.blogjava.net/rain1102/comments/177315.htmlhttp://www.blogjava.net/rain1102/articles/177315.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/177315.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/177315.html<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> Tip </TITLE>
  <script type="text/JavaScript">
 function showTip(oEvent) {
  var oDiv = document.getElementById("divTip1");
  oDiv.style.visibility = "visible";
  oDiv.style.left = oEvent.clientX + 5;
  oDiv.style.top = oEvent.clientY + 5;
 }
 function hideTip(oEvent) {
  var oDiv = document.getElementById("divTip1");
  oDiv.style.visibility = "hidden";
 }
  </script>
 </HEAD>

 <BODY>
 <p>Move your mouser over the red square.</p>
 <div id="div1" style="background-color:red; height:50px; width:50px" onmouseover="showTip(event);" onmouseout="hideTip(event);"><div>
 <div id="divTip1" style="background-color:yellow;position:absolute;visibility:hidden;padding:5px">
  <span style="font-weight:bold">Custom Tooltip</span><br/>
 </div>
 </BODY>
</HTML>



Eric.Zhou 2008-01-23 16:38 发表评论
]]>showModalDialog和showModelessDialog使用http://www.blogjava.net/rain1102/articles/176785.htmlEric.ZhouEric.ZhouMon, 21 Jan 2008 08:27:00 GMThttp://www.blogjava.net/rain1102/articles/176785.htmlhttp://www.blogjava.net/rain1102/comments/176785.htmlhttp://www.blogjava.net/rain1102/articles/176785.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/176785.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/176785.html问题描述：有一个列表，点击每个标题弹出新页面进入修改该标题的具体内容。提交以后，子页面关闭，父页面刷新。
经常想起来的是使用window.open弹出一个新窗口，然后好像这个不好处理。所以到网上查了一下，使用了window.showModalDialog方法。

ShowModalDialog函数的功能：
打开一个子窗口，并且可与父窗口相互传递数据，它与window.open的最大区别就在于由ShowModalDialog打开子窗口后，父窗口将不能操作。
使用方法：
vReturnValue = window.showModalDialog(sURL [, vArguments] [, sFeatures])
参数说明：
sURL
必选参数，类型：字符串。用来指定对话框要显示的文档的URL。
vArguments
可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures
可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，用分号“;”隔开。
        dialogHeight 对话框高度，不小于１００px，ＩＥ４中dialogHeight 和 dialogWidth 默认的单位是em，而ＩＥ５中是px，为方便其见，在定义modal方式的对话框时，用px做单位。
　　 dialogWidth: 对话框宽度。
　　 dialogLeft: 距离桌面左的距离。
　　 dialogTop: 离桌面上的距离。
　　 center: {yes | no | 1 | 0 }：窗口是否居中，默认yes，但仍可以指定高度和宽度。
　　 help: {yes | no | 1 | 0 }：是否显示帮助按钮，默认yes。
　　 resizable: {yes | no | 1 | 0 } ［ＩＥ５＋］：是否可被改变大小。默认no。
　　 status: {yes | no | 1 | 0 } ［IE5+］：是否显示状态栏。默认为yes[ Modeless]或no  [Modal]。
       scroll:{ yes | no | 1 | 0 | on | off }：指明对话框是否显示滚动条。默认为yes。
参数传递方法：
父窗口向子窗口传递参数采用ShowModalDialog的第2个参数即可，父窗口要获取子窗口传回的参数则可通过ShowModalDialog函数的返回值获取。
子窗口获取父窗口参数的方法为采用子窗口window对象dialogArguments属性获取，例如：
var a=window.dialogArguments;
子窗口向父窗口返回参数采用window.returnValue属性，如：
window.returnValue=1;
window.close();

比如实现上面问题，只需要这样：
var  url = "page.html";
  var retValue = window.showModalDialog(url, "newwindow", "dialogWidth:500px;dialogHeight:200px;help:no;resizable:no;scroll:no;status:no");

if (retValue == "ok")
  {
   document.location.reload(true);
  }

注意这里要在page页面中提交事件里添加
window.returnValue = "ok";
window.close();
这样就可以实现上面的功能了！

一、showModalDialog和showModelessDialog有什么不同？
　　showModalDialog：被打开后就会始终保持输入焦点。除非对话框被关闭，否则用户无法切换到主窗口。类似alert的运行效果。
　　showModelessDialog：被打开后，用户可以随机切换输入焦点。对主窗口没有任何影响。

二、怎样才让在showModalDialog和showModelessDialog的超连接不弹出新窗口？
　　在被打开的网页里加上<base target="_self">就可以了。这句话一般是放在<html>和<body>之间的。

三、怎样才刷新showModalDialog和showModelessDialog里的内容？
　　在showModalDialog和showModelessDialog里是不能按F5刷新的，又不能弹出菜单。这个只能依靠javascript了，以下是相关代码：

<body onkeydown="if (event.keyCode==116){reload.click()}">
<a id="reload" href="filename.htm" style="display:none">reload...</a>

　　将filename.htm替换成网页的名字然后将它放到你打开的网页里，按F5就可以刷新了，注意，这个要配合<base target="_self">使用，不然你按下F5会弹出新窗口的。

四、如何用javascript关掉showModalDialog(或showModelessDialog)打开的窗口。
　　<input type="button" value="关闭" onclick="window.close()">
　　也要配合<base target="_self">，不然会打开一个新的IE窗口，然后再关掉的。



Eric.Zhou 2008-01-21 16:27 发表评论
]]>RSShttp://www.blogjava.net/rain1102/articles/176345.htmlEric.ZhouEric.ZhouFri, 18 Jan 2008 14:14:00 GMThttp://www.blogjava.net/rain1102/articles/176345.htmlhttp://www.blogjava.net/rain1102/comments/176345.htmlhttp://www.blogjava.net/rain1102/articles/176345.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/176345.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/176345.html阅读全文

Eric.Zhou 2008-01-18 22:14 发表评论
]]>XML/XSL-FOhttp://www.blogjava.net/rain1102/articles/176203.htmlEric.ZhouEric.ZhouFri, 18 Jan 2008 06:36:00 GMThttp://www.blogjava.net/rain1102/articles/176203.htmlhttp://www.blogjava.net/rain1102/comments/176203.htmlhttp://www.blogjava.net/rain1102/articles/176203.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/176203.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/176203.html阅读全文

Eric.Zhou 2008-01-18 14:36 发表评论
]]>JS常见的location及URL变量 http://www.blogjava.net/rain1102/articles/174604.htmlEric.ZhouEric.ZhouFri, 11 Jan 2008 05:29:00 GMThttp://www.blogjava.net/rain1102/articles/174604.htmlhttp://www.blogjava.net/rain1102/comments/174604.htmlhttp://www.blogjava.net/rain1102/articles/174604.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/174604.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/174604.htmlalert(location);
alert(location.href);
alert(location.search);
alert(location.pathname);

上面四个分别得到下面四个结果

http://www.baidu.com/s/abc/d?ie=gb2312&bs=baseURL&sr=&z=&cl=3&f=8&wd=baseURL+IE+FF&ct=0
http://www.baidu.com/s/abc/d?ie=gb2312&bs=baseURL&sr=&z=&cl=3&f=8&wd=baseURL+IE+FF&ct=0
?ie=gb2312&bs=baseURL&sr=&z=&cl=3&f=8&wd=baseURL+IE+FF&ct=0
/s/abc/d



Eric.Zhou 2008-01-11 13:29 发表评论
]]>如何在dwr的回调函数中传递多个参数http://www.blogjava.net/rain1102/articles/171357.htmlEric.ZhouEric.ZhouFri, 28 Dec 2007 15:42:00 GMThttp://www.blogjava.net/rain1102/articles/171357.htmlhttp://www.blogjava.net/rain1102/comments/171357.htmlhttp://www.blogjava.net/rain1102/articles/171357.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/171357.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/171357.html       var num = countryId.indexOf("Country");
      var prefix = countryId.substr(0,num);
      var countryId = document.getElementById(countryId).value;
 
      loveService.getProvincesByCountry(countryId, function(data){
      callBackProvices(data,prefix);
   });
   resetProvince(prefix+"Province");
   resetCity(prefix+"City");
  }
 
  function callBackProvices(data, prefix) {
      var provinceId = prefix+'Province';
   DWRUtil.removeAllOptions(provinceId);
   DWRUtil.addOptions(provinceId, arrayObject, 'value', 'name');
   DWRUtil.addOptions(provinceId, data);
  }

 



Eric.Zhou 2007-12-28 23:42 发表评论
]]>snap给文章中的链接加上缩略图(小教程)（转载）http://www.blogjava.net/rain1102/articles/168953.htmlEric.ZhouEric.ZhouThu, 20 Dec 2007 02:36:00 GMThttp://www.blogjava.net/rain1102/articles/168953.htmlhttp://www.blogjava.net/rain1102/comments/168953.htmlhttp://www.blogjava.net/rain1102/articles/168953.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/168953.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/168953.html标放到链接上就可以看到缩略图。
效果演示见本站首页

具体使用办法，
到snap网站可以申请到一段类似以下形式的代码：

<script defer id="snap_preview_anywhere" type="text/javascript" src="http://spa.snap.com/snap_preview_anywhere.js?ap=1&amp;key=739080a127808f9856fa43a8c91c4d21&amp;sb=1&amp;domain=dimlau.com"></script>

将代码置于页面代码的</head>前面就可以了。（经测试，为不拖慢速度，放在</body>前也可以，）

下面说说代码的修改：

1、使用默认的代码，鼠标移动到链接上时显示的效果是带搜索框的，但是可以通过修改代码来去掉搜索框，先看效果对比：
snap

修改方法是，将获得代码中的sb=1改成sb=0

2、默认代码效果是页面中的所有链接都有鼠标划过时显示缩略图效果。如果你想对某个特定链接禁用缩略图效果，可以对该链接加上一个分类来标识；
例如链接

<a href="xxxx">xxx</a>
，禁用缩略图的方法是写成
<a href="xxxx" class="snap_nopreview">xxx</a>

通常，一个页面里大部分链接我们都不想加入缩略图的，所以上述办法有点烦琐了。
其实可以通过修改代码中的ap=1为ap=0来使页面的所有链接在默认情况下不显示缩略图，这时只有链接写成以下格式的情况下才会有缩略图显示：

<a class="snap_preview" href="XXX">XXX</a>

对于上述各种情况，如果链接本身已经有了某个class分类，比如已经分类为class="123",可以用空格来分隔，并赋予多个class分类，比如
class="123 snap_nopreview"或者class="123 snap_preview"

以上为本人的一点小小心得，希望对各位看官有点帮助。
--------------------------------------------------------------------------------------------------------

对于我使用的MT，可以对模版中的评论者网站链接形式加入一个class="snap_preview"来实现对评论者网站界面的初步预览，我觉得是个不错的小工具。
当然其他程序，也可以做相应的修改实现该效果。我就不再多说了。



Eric.Zhou 2007-12-20 10:36 发表评论
]]>符合web标准插入Flash的方法http://www.blogjava.net/rain1102/articles/168268.htmlEric.ZhouEric.ZhouMon, 17 Dec 2007 08:57:00 GMThttp://www.blogjava.net/rain1102/articles/168268.htmlhttp://www.blogjava.net/rain1102/comments/168268.htmlhttp://www.blogjava.net/rain1102/articles/168268.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/168268.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/168268.html符合web标准插入Flash的方法

Eric.Zhou 2007-12-17 16:57 发表评论
]]>使用CSS控制图片对齐方式http://www.blogjava.net/rain1102/articles/168013.htmlEric.ZhouEric.ZhouSat, 15 Dec 2007 15:04:00 GMThttp://www.blogjava.net/rain1102/articles/168013.htmlhttp://www.blogjava.net/rain1102/comments/168013.htmlhttp://www.blogjava.net/rain1102/articles/168013.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/168013.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/168013.html

Eric.Zhou 2007-12-15 23:04 发表评论
]]>QQ和MSN在线聊天代码http://www.blogjava.net/rain1102/articles/167483.htmlEric.ZhouEric.ZhouThu, 13 Dec 2007 06:07:00 GMThttp://www.blogjava.net/rain1102/articles/167483.htmlhttp://www.blogjava.net/rain1102/comments/167483.htmlhttp://www.blogjava.net/rain1102/articles/167483.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/167483.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/167483.html <a target=blank href=http://wpa.qq.com/msgrd?V=1&Uin=65305003&Site=http://www.sonicsoft.net&Menu=yes><img border="0" SRC=http://wpa.qq.com/pa?p=1:65305003:1 alt="点击这里给我发消息"></a>

MSN在线聊天代码
<A href="msnim:chat?contact=xie_wansong@hotmail.com" target=blank>点这里和我MSN聊天</A>

MSN从7。5开始加入了命令行控制，你可以在网页中加入“与我交谈”这样的按钮了，访问者点击就可以直接用他的MSN与你对话，代码是

建立对话：msnim:chat?contact=[邮件地址]

添加好友：msnim:add?contact=[邮件地址]

语音聊天：msnim:voice?contact=[邮件地址]

视频聊天：msnim:video?contact=[邮件地址]

用的时候把[邮件地址]写成你的MSN账号，不要方括号，用链接即可，如

<a href="msnim:chat?contact=yourname@hotmail.com">与我交谈</a>

<a href="msnim:add?contact=yourname@hotmail.com">加我为好友</a>


Eric.Zhou 2007-12-13 14:07 发表评论
]]>CSS样式切换技巧 - 动态更换网页色彩皮肤(转)http://www.blogjava.net/rain1102/articles/163809.htmlEric.ZhouEric.ZhouWed, 28 Nov 2007 12:58:00 GMThttp://www.blogjava.net/rain1102/articles/163809.htmlhttp://www.blogjava.net/rain1102/comments/163809.htmlhttp://www.blogjava.net/rain1102/articles/163809.html#Feedback2http://www.blogjava.net/rain1102/comments/commentRss/163809.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/163809.html样式与数据分离所带来的不只是符合标准这样的简单，样式既然与数据分离那么样式的切换则变得理所当然的了！但是网上这样的中文教程实在是太少了！所以我收集了一部分中外网站已经实现的技术资料整理出来供网友参考。

首先要具备不同内容的CSS文件（最好每个文件代表一种样式，或是代表需要作出变动的部分）。这里以三个为例：

第一个是背景为红色的CSS文件（red.css）CSS中的内容为：

Copy code

body {background-color:red;}

第二个是背景为绿色的CSS文件（green.css）CSS中的内容为： 

Copy code

body {background-color:green;}

第三个是背景为黄色的CSS文件（yellow.css）CSS中的内容为：

Copy code

body {background-color:yellow;}

然后在xthml文件中加入这三个CSS的链接

Copy code

<link rel="alternate stylesheet" href="red.css" type="text/css" title="red" media="screen, projection"/>
<link rel="stylesheet" href="green.css" type="text/css" title="green" media="screen, projection"/>
<link rel="alternate stylesheet" href="yellow.css" type="text/css" title="yellow" media="screen, projection"/>

这三个中除了title不一样外还有一个地方有所不同，那就是REL。第一个与第三个都是alternate stylesheet只有第二个是stylesheet。这第二个就是当然样式。

在链接下面再导入一个JS文件，用来控制这个样式切换

Copy code

function setActiveStyleSheet(title) {
  var i, a, main;
  if (title) {
  for(i=0; (a = document.getElementsByTagName('link')[i]); i++) {
  if(a.getAttribute('rel').indexOf('style') != -1 && a.getAttribute('title')) {
  a.disabled = true;
  if(a.getAttribute('title') == title) a.disabled = false;
  }
  }
  }
  }
  function getActiveStyleSheet() {
  var i, a;
  for(i=0; (a = document.getElementsByTagName('link')[i]); i++) {
  if(a.getAttribute('rel').indexOf('style') != -1 && a.getAttribute('title') && !a.disabled) return a.getAttribute('title');
  }
  return null;
}


在合适的地方加入三个切换按钮

Copy code

<a href="javascript :void()" onclick="setActiveStyleSheet('red'); return false;" title="红色样式"></a>
<a href="javascript :void()" onclick="setActiveStyleSheet('green'); return false;" title="绿色样式"></a>
<a href="javascript :void()" onclick="setActiveStyleSheet('yellow'); return false;" title="黄色样式"></a>
<a href="javascript :void()" onclick="setActiveStyleSheet('none'); return false;" title="没有样式"></a>

好了发布试试点那三个切换链接！是不是已经切换了样式？


补遗：带有记忆功能的JS文档

Copy code

function setActiveStyleSheet(title) {
var i, a, main;
for(i=0; (a = document.getElementsByTagName
("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style")
!= -1 && a.getAttribute("title")) {
a.disabled = true;
if(a.getAttribute("title") == title)
a.disabled = false;
}
}
}
function getActiveStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName
("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style")
!= -1 && a.getAttribute("title") && !a.disabled)
return a.getAttribute("title");
}
return null;
}
function getPreferredStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName
("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1
&& a.getAttribute("rel").indexOf("alt") == -1
&& a.getAttribute("title")
) return a.getAttribute("title");
}
return null;
}
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else expires = "";
document.cookie = name+"="+value+expires+";
path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return
c.substring(nameEQ.length,c.length);
}
return null;
}
window.onload = function(e) {
var cookie = readCookie("style");
var title = cookie ? cookie :
getPreferredStyleSheet();
setActiveStyleSheet(title);
}
window.onunload = function(e) {
var title = getActiveStyleSheet();
createCookie("style", title, 365);
}
var cookie = readCookie("style");
var title = cookie ? cookie :
getPreferredStyleSheet();
setActiveStyleSheet(title);



Eric.Zhou 2007-11-28 20:58 发表评论
]]>Display与Visibility的不同 http://www.blogjava.net/rain1102/articles/75390.htmlEric.ZhouEric.ZhouMon, 16 Oct 2006 04:58:00 GMThttp://www.blogjava.net/rain1102/articles/75390.htmlhttp://www.blogjava.net/rain1102/comments/75390.htmlhttp://www.blogjava.net/rain1102/articles/75390.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/75390.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/75390.htmlcss中的display与visibility——大多数人很容易将css属性display和visibility混淆，它们看似没有什么不同，其实它们的差别却是很大的。 visibility属性用来确定元素是显示还是隐藏，这用visibility="visible|hidden"来表示，visible表示显示，hidden表示隐藏。当visibility被设置为"hidden"的时候，元素虽然被隐藏了，但它仍然占据它原来所在的位置。

Eric.Zhou 2006-10-16 12:58 发表评论
]]>HTTP状态代码http://www.blogjava.net/rain1102/articles/72432.htmlEric.ZhouEric.ZhouThu, 28 Sep 2006 00:19:00 GMThttp://www.blogjava.net/rain1102/articles/72432.htmlhttp://www.blogjava.net/rain1102/comments/72432.htmlhttp://www.blogjava.net/rain1102/articles/72432.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/72432.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/72432.html 状态代码 状态信息 代码含义 100 Continue 初始的请求已经接受，客户应当继续发送请求的其余部分。 101 Switching Protocols 服务器将遵从客户的请求转换到另外一种协议 200 OK 一切正常，对GET和POST请求的应答文档跟在后面。 201 Created 服务器已经创建了文档，Location头给出了它的URL。 202 Accepted 已经接受请求，但处理尚未完成。 203 Non-Authoritative Information 文档已经正常地返回，但一些应答头可能不正确，因为使用的是文档的拷贝 204 No Content 没有新文档，浏览器应该继续显示原来的文档。如果用户定期地刷新页面，而Servlet可以确定用户文档足够新，这个状态代码是很有用的。 205 Reset Content 没有新的内容，但浏览器应该重置它所显示的内容。用来强制浏览器清除表单输入内容 206 Partial Content 客户发送了一个带有Range头的GET请求，服务器完成了它。 300 Multiple Choices 客户请求的文档可以在多个位置找到，这些位置已经在返回的文档内列出。如果服务器要提出优先选择，则应该在Location应答头指明。 301 Moved Permanently 客户请求的文档在其他地方，新的URL在Location头中给出，浏览器应该自动地访问新的URL。 302 Found 类似于301，但新的URL应该被视为临时性的替代，而不是永久性的。注意，在HTTP1.0中对应的状态信息是“Moved 303 See Other 类似于301/302，不同之处在于，如果原来的请求是POST，Location头指定的重定向目标文档应该通过GET提取 304 Not Modified 客户端有缓冲的文档并发出了一个条件性的请求（一般是提供If-Modified-Since头表示客户只想比指定日期更新的文档）。服务器告诉客户，原来缓冲的文档还可以继续使用。 305 Use Proxy 客户请求的文档应该通过Location头所指明的代理服务器提取 307 Temporary Redirect 和302（Found）相同。许多浏览器会错误地响应302应答进行重定向，即使原来的请求是POST，即使它实际上只能在POST请求的应答是303时才能重定向。由于这个原因，HTTP 1.1新增了307，以便更加清除地区分几个状态代码：当出现303应答时，浏览器可以跟随重定向的GET和POST请求；如果是307应答，则浏览器只能跟随对GET请求的重定向。 400 Bad Request 请求出现语法错误。 401 Unauthorized 客户试图未经授权访问受密码保护的页面。应答中会包含一个WWW-Authenticate头，浏览器据此显示用户名字/密码对话框，然后在填写合适的Authorization头后再次发出请求。 403 Forbidden 资源不可用。服务器理解客户的请求，但拒绝处理它。通常由于服务器上文件或目录的权限设置导致。 404 Not Found 无法找到指定位置的资源。这也是一个常用的应答。 405 Method Not Allowed 请求方法（GET、POST、HEAD、DELETE、PUT、TRACE等）对指定的资源不适用。 406 Not Acceptable 指定的资源已经找到，但它的MIME类型和客户在Accpet头中所指定的不兼容 407 Proxy 类似于401，表示客户必须先经过代理服务器的授权。 408 Request Timeout 在服务器许可的等待时间内，客户一直没有发出任何请求。客户可以在以后重复同一请求。 409 Conflict 通常和PUT请求有关。由于请求和资源的当前状态相冲突，因此请求不能成功。 410 Gone 所请求的文档已经不再可用，而且服务器不知道应该重定向到哪一个地址。它和404的不同在于，返回407表示文档永久地离开了指定的位置，而404表示由于未知的原因文档不可用。 411 Length Require 服务器不能处理请求，除非客户发送一个Content-Length头。 412 Precondition Failed 请求头中指定的一些前提条件失败 413 Request Entity Too Large 目标文档的大小超过服务器当前愿意处理的大小。如果服务器认为自己能够稍后再处理该请求，则应该提供一个Retry-After头 414 Request URI Too Long URI太长 。 416 Requested Range Not Satisfiable 服务器不能满足客户在请求中指定的Range头。 500 Internal Server Error 服务器遇到了意料不到的情况，不能完成客户的请求。 501 Not Implemented 服务器不支持实现请求所需要的功能。例如，客户发出了一个服务器不支持的PUT请求。 502 Bad Gateway 服务器作为网关或者代理时，为了完成请求访问下一个服务器，但该服务器返回了非法的应答。 503 Service Unavailable 服务器由于维护或者负载过重未能应答。例如，Servlet可能在数据库连接池已满的情况下返回503。服务器返回503时可以提供一个Retry-After头。 504 Gateway Timeout 由作为代理或网关的服务器使用，表示不能及时地从远程服务器获得应答。 505 HTTP Version Not Supported 服务器不支持请求中所指明的HTTP版本。

Eric.Zhou 2006-09-28 08:19 发表评论
]]>innerText和innerHTML的区别http://www.blogjava.net/rain1102/articles/71765.htmlEric.ZhouEric.ZhouMon, 25 Sep 2006 07:41:00 GMThttp://www.blogjava.net/rain1102/articles/71765.htmlhttp://www.blogjava.net/rain1102/comments/71765.htmlhttp://www.blogjava.net/rain1102/articles/71765.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/71765.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/71765.html先看下面的代码
<html>
<head><title>test</title>
<script language="javascript">
function show1(){
document.all.test.innerText="<font color=blue>test</font>";
}
function show2(){
document.all.test.innerHTML="<font color=blue>test</font>";
}
</script>
</head>
<body>
<table><tr><td id=test><font color=red>innerText</font></td>
</tr></table>
<a href="javascript:show1();">testinnerText</a>
<a href="javascript:show2();">testinnerHTML</a>
</body>
</html>
对于innerText，即把"<font color=blue>test</font>"当成整体内容显示出来。而对于innerHTML而言，则把"<font color=blue>test</font>"当成页面的一部分，即显示兰色的test字符！

Eric.Zhou 2006-09-25 15:41 发表评论
]]>HTML技巧-事件触发列表与解说http://www.blogjava.net/rain1102/articles/67713.htmlEric.ZhouEric.ZhouTue, 05 Sep 2006 00:17:00 GMThttp://www.blogjava.net/rain1102/articles/67713.htmlhttp://www.blogjava.net/rain1102/comments/67713.htmlhttp://www.blogjava.net/rain1102/articles/67713.html#Feedback0http://www.blogjava.net/rain1102/comments/commentRss/67713.htmlhttp://www.blogjava.net/rain1102/services/trackbacks/67713.html阅读全文

Eric.Zhou 2006-09-05 08:17 发表评论
]]>