📄 letter.jsp
字号:
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://jakarta.apache.org/struts/tags-bean" prefix="bean"%>
<%@ taglib uri="http://jakarta.apache.org/struts/tags-html" prefix="html"%>
<%@ taglib uri="http://jakarta.apache.org/struts/tags-logic" prefix="logic"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
var xmlHttp;
var completeDiv;
var inputField;
var nameTable;
var nameTableBody;
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}else if(window.XMLHttpRequest){
xmlHttp=new XMLHttpRequest();
}
}
function initVars(){
inputField=document.getElementById("songNameLetter");
nameTable=document.getElementById("name_table");
completeDiv=document.getElementById("popup");
nameTableBody=document.getElementById("name_table_body");
}
function findNames(){
initVars();
if(inputField.value.length>0){
createXMLHttpRequest();
var url="<%=basePath%>songs.do?methods=getNames&songNameLetter="+escape(inputField.value);
xmlHttp.open("GET",url,true);
xmlHttp.onreadystatechange=callback;
xmlHttp.send(null);
}else{
clearNames();
}
}
function callback(){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
var name=xmlHttp.responseXML.getElementsByTagName("name")[0].firstChild.data;
setNames(xmlHttp.responseXML.getElementsByTagName("name"));
}else if(xmlHttp.status==204){
clearNames();
}
}
}
function setNames(the_names){
clearNames();
var size=the_names.length;
setOffsets();
var row,cell,txtNode;
for(var i=0;i<size;i++){
var nextNode=the_names[i].firstChild.data;
row=document.createElement("tr");
cell=document.createElement("td");
cell.onmouseout=function(){this.className='mouseOver'};
cell.onmouseover=function(){this.className='mouseOut'};
cell.setAttribute("bgcolor","#FFFAFA");
cell.setAttribute("border","0");
cell.onclick=function(){populateName(this)};
txtNode=document.createTextNode(nextNode);
cell.appendChild(txtNode);
row.appendChild(cell);
nameTableBody.appendChild(row);
}
}
function setOffsets(){
var end=inputField.offsetWidth;
var left=calculateOffsetLeft(inputField);
var top=calculateOffsetTop(inputField)+inputField.offsetHeight;
completeDiv.style.border="black 1px solid";
completeDiv.style.left=left+"px";
completeDiv.style.top=top+"px";
nameTable.style.width=end+"px";
}
function calculateOffsetLeft(field){
return calculateOffset(field,"offsetLeft");
}
function calculateOffsetTop(field){
return calculateOffset(field,"offsetTop");
}
function calculateOffset(field,attr){
var offset=0;
while(field){
offset+=field[attr];
field=field.offsetParent;
}
return offset;
}
function populateName(cell){
inputField.value=cell.firstChild.nodeValue;
clearNames();
}
function clearNames(){
var ind=nameTableBody.childNodes.length;
for(var i=ind-1;i>=0;i--){
nameTableBody.removeChild(nameTableBody.childNodes[i]);
}
completeDiv.style.border="none";
}
</script>
</head>
<body>
<html:form action="/songs.do?methods=getLetterList">
<label>查询:</label>
<!--<html:text property="songNameLetter"></html:text>-->
<input type="text" size="20" id="songNameLetter" name="songNameLetter" onkeyup="findNames()" style="height:20;" />
<div style="position:absolute;" id="popup">
<table id="name_table" bgcolor="#FFFAFA" border="0" cellpadding="0" cellspacing="0" >
<tbody id="name_table_body"></tbody>
</table>
</div>
<html:submit value="查找"></html:submit>
</html:form>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -