主要代码

<p><label class="lbright">验证码：</label><span>
      <input type="text" name="validcode" style="width:70px; vertical-align:middle;" id="validcode"/>
      <img id="codePic" src="http://127.0.0.1:8888/TP/codePic" width="60" height="21" style="vertical-align:middle;cursor:pointer;"/>
      </span>
      <a class="blurry" id="newPic" οnclick="getPic();">看不清楚，换一张</a>
</p>

<script type="text/javascript">
     function getPic(){ 
           $("#codePic").attr("src","http://127.0.0.1:8888/TP/codePic?flag="+Math.random());
      };
</script>

这部分最重要的就是 $("#codePic").attr("src","http://127.0.0.1:8888/TP/codePic?flag="+Math.random()); 这部分的代码。如果不加flag="+Math.random()是实现不了局部刷新的功能的。因为src中如果每次访问的地址一样的话就会发生不更新的情况。具体为什么会发生这种情况大家可以自己去研究。而codePic其实是一个action。这个action的功能是利用java画笔画出验证码并打包成图片返回给img中的src。