WEB开发总结（持续更新。。。）

　　近期开始搞搞web的东西，觉得有必要把遇到的问题总结一下，就在这里当做个笔记本吧。

1.用maven建立的web工程，在运行的时候，右键找不到“Run on server”菜单:

可以在命令提示行中，切换到项目的根目录，输入如下命令：

即：

mvn eclipse:eclipse -Dwtpversion=1.0

刷新下eclipse work space，就出现了Run as on server了：

2.关于div的垂直居中

CSS中的确是有vertical-align属性，但是它只对(X)HTML元素中拥有valign特性的元素才生效，例如表格元素中的<td>、<th>、<caption>等，而像<div>、<span>这样的元素是没有valign特性的，因此使用vertical-align对它们不起作用。没关系，我们可以解决它。

(1)单行垂直居中

如果一个容器中只有一行文字，对它实现居中相对比较简单，我们只需要设置它的实际高度height和所在行的高度line-height相等即可。如：

 div {
     height:25px;
     line-height:25px;
     overflow:hidden;
} 

这段代码很简，后面使用overflow:hidden的设置是为了防止内容超出容器或者产生自动换行，这样就达不到垂直居中效果了

(2)多行未知高度文字的垂直居中

如果一段内容，它的高度是可变的,那么我们就可以通过设定Padding，使上下的padding值相同即可。可以使用类似下面的代码：

 div {
      padding:25px;
 }

这种方法的优点就是它可以在任何浏览器上运行，并且代码很简单，只不过这种方法应用的前提就是容器的高度必须是可伸缩的。

(3)多行文本固定高度的居中

在CSS中还有一个display属性能够模拟<table>，所以我们可以使用这个属性来让<div>模拟<table>就可以使用vertical-align了。注意，display:table和display:table-cell的使用方法，前者必须设置在父元素上，后者必须设置在子元素上，因此我们要为需要定位的文本再增加一个<div>元素：

div#wrap {
    height:400px;
    display:table;
}
div#content {
    vertical-align:middle;
    display:table-cell;
    border:1px solid #FF0099;
    background-color:#FFCCFF;
width:760px;
11.}  

3.用tomcat部署javaEE应用，出现：

严重: Servlet.service() for servlet jsp threw exception

java.lang.AbstractMethodError: javax.servlet.jsp.JspFactory.getJspApplicationContext(Ljavax/servlet/ServletContext;)Ljavax/servlet/jsp/JspApplicationContext;
     at org.apache.jsp.index_jsp._jspInit(index_jsp.java:22)
     at org.apache.jasper.runtime.HttpJspBase.init(HttpJspBase.java:80)
     at org.apache.jasper.servlet.JspServletWrapper.getServlet(JspServletWrapper.java:149)
     at org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:311)
     at org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:315)
     at org.apache.jasper.servlet.JspServlet.service(JspServlet.java:265)
     at javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
     at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
     at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
     at org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter.doFilter(StrutsPrepareAndExecuteFilter.java:88)
     at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
     at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
     at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
     at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:191)
     at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:127)
     at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
     at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
     at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:298)
     at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:859)
     at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:588)
     at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:489)
     at java.lang.Thread.run(Thread.java:662)

这是因为项目中可能有重复的servlet.api jar包，检查下。发布的时候，最好先clean下tomcat。

5.编译jsp的时候出现：

java.lang.NoSuchMethodError: org.eclipse.jdt.internal.compiler.CompilationResult.getProblems()[Lorg/eclipse/jdt/core/compiler/IProblem;
     at org.apache.jasper.compiler.JDTCompiler$2.acceptResult(JDTCompiler.java:354)
     at org.eclipse.jdt.internal.compiler.Compiler.compile(Compiler.java:398)
     at org.apache.jasper.compiler.JDTCompiler.generateClass(JDTCompiler.java:425)
     at org.apache.jasper.compiler.Compiler.compile(Compiler.java:298)
     at org.apache.jasper.compiler.Compiler.compile(Compiler.java:277)
     at org.apache.jasper.compiler.Compiler.compile(Compiler.java:265)
     at org.apache.jasper.JspCompilationContext.compile(JspCompilationContext.java:564)
     at org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:299)
     at org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:315)
     at org.apache.jasper.servlet.JspServlet.service(JspServlet.java:265)
     at javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
     at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
     at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
     at org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter.doFilter(StrutsPrepareAndExecuteFilter.java:88)
     at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
     at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
     at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
     at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:191)
     at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:127)
     at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
     at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
     at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:298)
     at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:859)
     at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:588)
     at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:489)
     at java.lang.Thread.run(Thread.java:662)

检查下maven工程所依赖的jar包、依赖的其他的工程是否已经下载到本地。

6.

SEVERE: Error configuring application listener of class org.springframework.web.context.ContextLoaderListener

java.lang.ClassNotFoundException: org.springframework.web.context.ContextLoaderListener
    at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1676)
    at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1521)
    at org.apache.catalina.core.DefaultInstanceManager.loadClass(DefaultInstanceManager.java:415)
    at org.apache.catalina.core.DefaultInstanceManager.loadClassMaybePrivileged(DefaultInstanceManager.java:397)
    at org.apache.catalina.core.DefaultInstanceManager.newInstance(DefaultInstanceManager.java:118)
    at org.apache.catalina.core.StandardContext.listenerStart(StandardContext.java:4660)
    at org.apache.catalina.core.StandardContext$1.call(StandardContext.java:5226)
    at org.apache.catalina.core.StandardContext$1.call(StandardContext.java:5221)
    at java.util.concurrent.FutureTask$Sync.innerRun(FutureTask.java:303)
    at java.util.concurrent.FutureTask.run(FutureTask.java:138)
    at java.util.concurrent.ThreadPoolExecutor$Worker.runTask(ThreadPoolExecutor.java:886)
    at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:908)
    at java.lang.Thread.run(Thread.java:662)

这是因为在打包的时候，没有把java classpath中的jar包包含进来，具体操作方法如下图：

7.有时候在写css时，显示效果会出现非常诡异的效果

不知道有没有遇到这种

 #logo{
 border: solid 1px blue;
 }

html:

<div id="logo"> logo</div>

居然显示的是红色！或者是标签属性设置之后不起作用！

弄了很久，发现并没有定义它啊！而且无法找到element.style任何地方。原来这是在system.css东西

怎么办呢？

使用!important即修改成：

 #logo{
 border: solid 1px blue !important;
 }  

就OK了。

9.通过formatter方法给Jquery easyui 的datagrid 每行增加操作链接

(1)需要 在datagrid行里添加一列，field指向id（field:'id'），然后对这列进行格式化处理（formater：格式化函数），如下：

 <th data-options="field:'id',width:180,formatter:  rowformater">操作</th>

(2)根据documentation的描述，formatter的格式化函数有3个parameters，分别是：

value: the field value，也就是field:'id'。

rowData: the row record data。就是这一行的Json数据，包括你已经选择在Datagrid上显示的内容，和没显示的内容。因为在Json数据里包括了Id这一内容，所以我可以直接调用。如果你作为数据源的Json里没有Id属性，需要修改一下Json的输出。每行Json输出是类似

{"id":"1","name":"scott","parentId":"0"}

的结构。

rowIndex: the row index.当前行的Index。

所以在写rowformater这个函数的时候，也需要用function rowformater(value,row,index)的方法。

 <script type="text/javascript">
  function rowformater(value,row,index)
  {
  return "<a href='"+row.id+"' target='_blank'>操作</a>";
  }
  </script>

10.jquery 获取easyui combobox选中的值：

$('#comboboxlist').combobox('getValue');

11.jQuery 中如何使用 JSON ：

（1）var obj = jQuery.parseJSON('{"name":"John"}');

（2）eval('{"name":"John"}');

------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

12.jsp页面标签中链接到服务器的action，服务器端却收不到响应。

此时应该首先利用火狐或者其他浏览器查看页面请求有没有发出去，检查下页面的代码，哪怕是给标签添加的响应事件函数名字没写对都会导致请求发不出去，我的就是这个原因导致的。

13.想要使用通配符，来操作多个id号类似的标签，直接使用$('#taskInstance*')是不行的，可以使用

$("[id^='taskInstance']")

来代替。

14.当鼠标移动到一个超链接的时候，怎么显示出一个提示标签来告诉用户这个当前的超链接是指向哪里的呢？

利用a标签的title属性可以解决：

<p><a href="/index.html" title="这是个提示框框">本文本</a> 是一个指向本网站中的一个页面的链接。</p>

此时，把鼠标移动到这个“本文本”的超链接上面时，会出现提示：

15.使用easyui中的datagrid数据表格，如何获取鼠标点击的那一行信息呢？可以使用其封装好的onClickRow方法来获取，具体使用示例：

 $('#dulala').datagrid({onClickRow: function(rowIndex, rowData){
     var row = $('#dulala').datagrid('getSelected');
     if(row){
         alert("index:" + index + "    field:" + field
                 + "    value:" + value
                 + "  studentId:" + row.studentId
                 + "  id:" + this.id);
     }
 }

其中，studentId是在表格中定义好的列属性，至于this.id就是当前表格的id号了，这里指的就是dulala。

其他相关的事件说明见：

http://www.jeasyui.com/documentation/index.php#

16. 如果你想查看一个 css属性 哪些浏览器支持 你可以用 http://caniuse.com/

 

17.javascript向后台struts的action传递参数方法：

 window.location.href="process_detail.action?studentId=%{studentId}";

18.easyui的datagrid表格中如何在不跟后台通信的情况下更改某个单元格的数据？使用updateRow方法可以实现：

 $('#gridID').datagrid("updateRow",{index:1,row:{cpu:'0',memory:'-1',disk:'-2'}}) 

其中cpu、memory、disk都是表格中的列名字，而index的值则是指定哪一行。

19.今天使用EasyUI的datagrid时发现首次打开页面时onLoadSuccess方法执行了两次。后来发现主要问题是datagrid被初始化了两次。主要原因是一开始html中声明了dg为easyui-datagrid控件。

 <table align="center" id="test" class="easyui-datagrid" title="xxx" width="100%" >

而用js又初始化了次datagrid

 $(document).ready(init);

      function init() {

          $('#test').datagrid({             

              ...

              loadMsg: '数据加载中...',

              url: 'xxx.action',              

              onLoadSuccess: function(data) {

              },

              onBeforeLoad: function(param) {

              }

          });       

      }

解决的方法就是在html代码中将

<table align="center" id="test" class="easyui-datagrid" title="xxx" width="100%" >

改为

<table align="center" id="test" title="xxx" width="100%" >

这样就不会重复初两次初始化控件了！

20.

 var all=$("#userGrid").datagrid("getData");获取datagrid的数据。

 var user=all.rows[i];

 var n=user.name;

 var i=user.id;

取决于datagrid定义的列。

 //获取datagrid被选中的数据
 var selections = $("#userGrid").datagrid("getSelections");

 var suser=selections[j];

 var n=suser.name;

 var  i=suser.id;

21.想要在easyui的datagrid表格数据加载完成之后触发某个事件，可以使用onLoadSuccess: function方法来完成。

22.jquery中的

  //当前 HTML 元素
  $(this)
  // 所有 <p> 元素
  $("p")
  //所有 class="intro" 的 <p> 元素
  $("p.intro")
  //所有 class="intro" 的元素
  $(".intro")
  // id="intro" 的第一个元素
  $("#intro")
  //每个 <ul> 的第一个 <li> 元素
  $("ul li:first")
  //所有带有以 ".jpg" 结尾的 href 属性的属性
  $("[href$='.jpg']")
  //id="intro" 的 <div> 元素中的所有 class="head" 的元素
  ("div#intro .head")

23.javascript中的 window.open和window.location区别：

(1)

window.location是window对象的属性，而window.open是window对象的方法;

window.location是对当前浏览器窗口的URL地址对象的参考,window.open是用来打开一个新窗口的函数

(2)window.open不一定是打开一个新窗口,只有当窗口的名称和window.open中第二个参数中的一样才会将这个窗口替换，用这个特性的话可以在iframe和frame中来代替location.href。

如:

  <iframe name="aa"></iframe>   

   <input type=button onclick="window.open('1.htm','aa','')">

 和   

   <input type=button   

    onclick="self.frames['aa'].location.href='1.htm'">

 效果一样

(3)

在给按钮、表格、单元格、下拉列表和DIV等做链接时一般都要用Javascript来完成，和做普通链接一样，可能我们需要让链接页面在当前窗口打开，也可能需要在新窗口打开，这时我们就可以使用下面两项之一来完成：

window.open用来打开新窗口,window.location 用来替换当前页，也就是重新定位当前页.

如：

 <input type="button" value="新窗口打开" onclick="window.open('http://www.jd.com')"> 

 <input type="button" value="当前页打开" onclick="window.location='http://www.jd.com/'"> 

(4)window.location或window.open如何指定target?

解决办法:

window.location 改为 top.location　即可在顶部链接到指定页

或

window.open("网址URL","_top");

24.javascript获取当前时间：

/**

* 获取当前时间

* */

function getCurrentTime()

{

var d,s;

d = new Date();

s = d.getYear() + "-";             //取年份

s = s + (d.getMonth() + 1) + "-";//取月份

s += d.getDate() + " ";         //取日期

s += d.getHours() + ":";       //取小时

s += d.getMinutes() + ":";    //取分

s += d.getSeconds();         //取秒

return(s);

}

25.

javascript中的加法：

(1)a*1+b

(2)parseInt(a)+1

(3)eval(a)+1

26.toUpperCase()变为大写字母，toLowerCase()变为小写字母

27.easyui中的下拉列表高度：

if (_7dc.panel("options").closed) {

_7dc.panel("open");

_7dc.css("height","auto");

_7dc.css("min-height","26px");

_7dc.css("max-height","198px");

opts.onShowPanel.call(_7da);

}

28.Restlet服务错误：

Stop accepting new connections and transactions. Consider increasing the maximum number of threads. 

解决：

getContext().getParameters().add("maxThreads", "200");

29.连接zookeeper集群时，

[ZooKeeperSaslClient] SecurityException: java.lang.SecurityException: 无法定位登录配置 occurred when trying to find JAAS configuration.

如果客户端和ZK集群不在一个网段内，那么客户端需要配置个host就可以避免这个问题。

30.将Java中的long型的毫秒时间值转为js的date类型：

function toDate(timestamp) {

var d = new Date(timestamp);

return d.format("yyyy-MM-dd hh:mm:ss");

}

31.采用uploadify结合struts2上传文件时，可以在uploadify的参数中设定好要上传的文件大小、文件数目等，但是对于文件大小来说，只在uploadify的配置文件中设置的话，有时候不会起作用，这时候需要配置struts2一起使用才行，示例如下：

 <constant name="struts.multipart.maxSize" value="104857600"></constant>

32.Eclipse中tomcat部署工程启动后报错：

严重: Error configuring application listener of class org.springframework.web.context.ContextLoaderListener
java.lang.ClassNotFoundException: org.springframework.web.context.ContextLoaderListener
    at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1678)
    at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1523)
    at org.apache.catalina.core.DefaultInstanceManager.loadClass(DefaultInstanceManager.java:415)
    at org.apache.catalina.core.DefaultInstanceManager.loadClassMaybePrivileged(DefaultInstanceManager.java:397)
    at org.apache.catalina.core.DefaultInstanceManager.newInstance(DefaultInstanceManager.java:118)
    at org.apache.catalina.core.StandardContext.listenerStart(StandardContext.java:4660)
    at org.apache.catalina.core.StandardContext$1.call(StandardContext.java:5226)
    at org.apache.catalina.core.StandardContext$1.call(StandardContext.java:5221)
    at java.util.concurrent.FutureTask$Sync.innerRun(FutureTask.java:303)
    at java.util.concurrent.FutureTask.run(FutureTask.java:138)
    at java.util.concurrent.ThreadPoolExecutor$Worker.runTask(ThreadPoolExecutor.java:886)
    at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:908)
    at java.lang.Thread.run(Thread.java:662)  

问题背景：

工程为maven工程，ContextLoaderListener类位于spring-web-3.1.0.RELEASE.jar包中。检查了maven的pom.xml，依赖引入正常。在工程Maven Dependencies视图中也能看到spring-web-3.1.0.RELEASE.jar包被正常引入进来了。

错误原因：

进入到tomcat的部署路径.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\下检查了一下，发现工程部署后在WEB-INF文件夹下没有生成lib目录，正常情况下，会生成lib目录并把工程的所有依赖jar包都部署到该目录下。

解决方案：

(1)右键点击项目--选择Properties

选择Deployment Assembly,在右边点击Add按钮，在弹出的窗口中选择Java Build Path Entries。如下图所示：

(2)点击Next，选择Maven Dependencies

(3)点击Finish，然后可以看到已经把Maven Dependencies添加到Web应用结构中了

操作完后，重新部署工程，不再报错了。然后我们再到.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\目录下，发现工程WEB-INF目录下自动生成了lib目录，并且所有的依赖jar包也都已经部署进来。问题因此解决。

33.

Eclipse在引入Maven工程后，找不到Maven Dependencies。使得代码报错，具体如下图所示：

而正常Maven的工程如下所示：

产生这种现象的原因可能是工程对应的开发环境改变，本地Maven仓库地址和原来的不一致。其根本原因是Maven project的Maven选项未开启或启动无效。

为了解决这个问题我们只需要重启Dependency Management就可以了。

具体步骤：右击 Maven project --> Macven --> Enable Dependency Management

开启后我们就能看到Maven Dependencies类库了

说明：如果我们原有的工程中的Maven处于Enable状态下，但是同样没有Maven Dependencies类库，我们将原有的Maven project执行Disable Dependency Management，然后再重启下就行了

34.pom把依赖工程的conf下的配置文件打包到当前工程的classes中

<resource>

    <directory>${project.basedir}/../test-common/conf/</directory>

    <includes>                

        <include>log4j.properties</include>

    </includes>

</resource>

35.java.io.IOException: Failed on local exception: com.google.protobuf.InvalidProtocolBufferException: Message missing required fields: callId, status; Host Details : local host

原因：客户端的hadoop包和集群的包不一致导致的