标签：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <base href="<%=basePath_%>"> <title></title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script> <link href="css/style.css" type="text/css" rel="stylesheet" /> <link rel="stylesheet" type="text/css" href="ec/css/tab.css"> <link rel="stylesheet" type="text/css" href="ec/css/basic.css"> <link rel="stylesheet" type="text/css" href="ec/css/css.css"> <link rel="stylesheet" type="text/css" href="ec/jsp/carTeamInfo/teamTask/dest/autosearch.css"> <style type="text/css"> .car_place_buttom{ width: 26px; height: 26px; line-height: 26px; text-align: center; background-color: #7392A9; float: left; margin-top: 5px; margin-left: 5px; font-size: 16px; border: 1px solid black; cursor: pointer; font-weight: bolder; -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10*/ -khtml-user-select:none;/*早期浏览器*/ user-select:none; } .car_place_buttom_E{ width: 26px; height: 26px; line-height: 26px; text-align: center; background-color: #1F6689; float: left; color:white; margin-top: 5px; margin-left: 5px; font-size: 16px; border: 1px solid black; cursor: pointer; font-weight: bolder; -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10*/ -khtml-user-select:none;/*早期浏览器*/ user-select:none; } .car_place_buttom_N{ width: 26px; height: 26px; line-height: 26px; text-align: center; background-color: #B23AEE; float: left; color:white; margin-top: 5px; margin-left: 5px; font-size: 16px; border: 1px solid black; cursor: pointer; font-weight: bolder; -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10*/ -khtml-user-select:none;/*早期浏览器*/ user-select:none; } </style> <script src="ec/jsp/carTeamInfo/teamTask/dest/jquery-1.11.2.js"></script> <script src="ec/jsp/carTeamInfo/teamTask/dest/autosearch.js"></script> </head> <script type="text/javascript"> $(function(){ $(".car_place_buttom").click(function(){ $("#carno").val($("#carno").val()+$(this).html()); }).hover( function () { $(this).css("background-color","#00ff00"); }, function () { $(this).css("background-color","#7392A9"); } ); $(".car_place_buttom_E").click(function(){ $("#carno").val($("#carno").val()+$(this).html()); }).hover( function () { $(this).css("background-color","#00ff00"); }, function () { $(this).css("background-color","#1F6689"); } ); $(".car_place_buttom_N").click(function(){ var hv = $(this).html(); if(hv == "←"){ var carnov = $("#carno").val(); if(carnov.length > 0){ $("#carno").val(carnov.substr(0,carnov.length -1)); } }else if(hv == "确 认"){ addCarDispacherInfo(); }else if(hv == "清 除"){ $("#carno").val(""); }else{ $("#carno").val($("#carno").val()+hv); } }).hover( function () { $(this).css("background-color","#00ff00"); }, function () { $(this).css("background-color","#B23AEE"); } ); //模糊查询 var input = $("#carno"); var autosearch = new AutoSearch(); autosearch.init({input:input ,autoShow:false,data:function(callback){ $.get("/query.jsp",{carno:input.val()},function(result){ callback(result); },‘json‘); } }); }); function swicthKeyboard(obj){ var keyboardstatues = $(obj).val(); if(keyboardstatues == "关闭键盘"){ $(obj).val("打开键盘"); $("#keyboard").hide(); }else{ $(obj).val("关闭键盘"); $("#keyboard").show(); } } </script> <body> <div class="ectbba" style="height: auto;"> <ul > <li> <div id="car_dispacher_info_iframe" style="width: 250px;border: 0px;float: left;overflow: hidden;"> <input id="carno" name="carno" type="text" value="" style="float:left;border: 1px solid blue;" onkeyup="this.value=this.value.toUpperCase();" /> </div> <div style="float: left;width: 245px;"> <input type="button" value="关闭键盘" onclick="swicthKeyboard(this);"> </div> </li> </ul> </div> <div id="keyboard" style="width: 300px;height: 302px;background-color: #ADD8E6;position: absolute ;margin-top: 32px;margin-left: 230px;z-index: 999"> <div style="width: 300px;height:132px;"> <div class="car_place_buttom">京</div> <div class="car_place_buttom">津</div> <div class="car_place_buttom">沪</div> <div class="car_place_buttom">渝</div> <div class="car_place_buttom">冀</div> <div class="car_place_buttom">豫</div> <div class="car_place_buttom">云</div> <div class="car_place_buttom">辽</div> <div class="car_place_buttom">黑</div> <div class="car_place_buttom">湘</div> <div class="car_place_buttom">皖</div> <div class="car_place_buttom">鲁</div> <div class="car_place_buttom">新</div> <div class="car_place_buttom">苏</div> <div class="car_place_buttom">浙</div> <div class="car_place_buttom">赣</div> <div class="car_place_buttom">鄂</div> <div class="car_place_buttom">桂</div> <div class="car_place_buttom">甘</div> <div class="car_place_buttom">晋</div> <div class="car_place_buttom">蒙</div> <div class="car_place_buttom">陕</div> <div class="car_place_buttom">吉</div> <div class="car_place_buttom">贵</div> <div class="car_place_buttom">粤</div> <div class="car_place_buttom">青</div> <div class="car_place_buttom">藏</div> <div class="car_place_buttom">川</div> <div class="car_place_buttom">宁</div> <div class="car_place_buttom">琼</div> </div> <div style="width: 300px;height:100px;"> <div class="car_place_buttom_E">A</div> <div class="car_place_buttom_E">B</div> <div class="car_place_buttom_E">C</div> <div class="car_place_buttom_E">D</div> <div class="car_place_buttom_E">E</div> <div class="car_place_buttom_E">F</div> <div class="car_place_buttom_E">G</div> <div class="car_place_buttom_E">H</div> <div class="car_place_buttom_E">J</div> <div class="car_place_buttom_E">K</div> <div class="car_place_buttom_E">L</div> <div class="car_place_buttom_E">M</div> <div class="car_place_buttom_E">N</div> <div class="car_place_buttom_E">O</div> <div class="car_place_buttom_E">P</div> <div class="car_place_buttom_E">Q</div> <div class="car_place_buttom_E">R</div> <div class="car_place_buttom_E">S</div> <div class="car_place_buttom_E">T</div> <div class="car_place_buttom_E">U</div> <div class="car_place_buttom_E">V</div> <div class="car_place_buttom_E">W</div> <div class="car_place_buttom_E">X</div> <div class="car_place_buttom_E">Y</div> <div class="car_place_buttom_E">Z</div> </div> <div style="width: 300px;height:72px;"> <div class="car_place_buttom_N">1</div> <div class="car_place_buttom_N">2</div> <div class="car_place_buttom_N">3</div> <div class="car_place_buttom_N">4</div> <div class="car_place_buttom_N">5</div> <div class="car_place_buttom_N">6</div> <div class="car_place_buttom_N">7</div> <div class="car_place_buttom_N">8</div> <div class="car_place_buttom_N">9</div> <div class="car_place_buttom_N">0</div> <div class="car_place_buttom_N" style="width: 65px;margin-left: 43px;">←</div> <div class="car_place_buttom_N" style="width: 65px;margin-left: 10px;">确 认</div> <div class="car_place_buttom_N" style="width: 65px;margin-left: 10px;">清 除</div> </div> </div> </body> <html>
jQuery文件等都是需要引入的
标签：
原文地址：http://www.cnblogs.com/clovem/p/5685443.html
