[size=x-large]
自己使用jquery-easyui编写的简单通用查询，字段类型未做判断，以后完善。
search.html代码如下：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>通用查询</title>
<link rel="stylesheet" type="text/css" href="themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="themes/icon.css">
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
<script type="text/javascript" src="search.js"></script>
<style type="text/css">
body {
margin:0; /* 必须 */
border:0;
height:100%; /* 必须 */
overflow-y:auto;/* 必须 */
}
#filter {display:block; top:10px; left:150px; width:130px; position:fixed;} /* IE并不认识fixed，而FF认识 */
* html #filter {position:absolute;} /* 这个只有IE认识 */
</style>
<script type="text/javascript">
var where = " where 1=1 ";
$(function(){
$('#filter').draggable({edge:5});
$('#filter').hide();
});
function openDiv() {
$('#filter').show();
}
function closeDiv() {
$('#filter').hide();
}
</script>
</head>
<body style="margin:0px">
<a id="opendiv" href="#" class="easyui-linkbutton" onclick="openDiv()">打开高级检索</a>
<a id="closediv" href="#" class="easyui-linkbutton" onclick="closeDiv()">关闭高级检索</a>
<div id="filter" style="margin:10px;padding:10px;width:600px;height:200px;background:#ddd;border:1px solid #ddd;">
<div id="filterTitle" style="background:#ccc;"><!--高级检索-->
<a id="find" href="#" class="easyui-linkbutton" onclick="findData()">开始检索</a>
<a id="add" href="#" class="easyui-linkbutton" onclick="addFilter()">增加</a>
<a id="del" href="#" class="easyui-linkbutton" onclick="delFilter()">删除</a>
<a id="up" href="#" class="easyui-linkbutton" onclick="upFilter()">上移</a>
<a id="down" href="#" class="easyui-linkbutton" onclick="downFilter()">下移</a>
<a id="clear" href="#" class="easyui-linkbutton" onclick="clearFilter()">清除</a>
<a id="closewin" href="#" class="easyui-linkbutton" onclick="closeDiv()">关闭高级检索</a>
</div>
<table id="filterTable" width="600px" border="1" style="font-size:10pt">
<tr>
<th width="50px"> </th>
<!--<th>左括号</th>-->
<th width="100px">字段</th>
<th width="100px">操作符</th>
<th width="200px">内容</th>
<th width="100px">逻辑条件</th>
<!--<th>右括号</th>-->
</tr>
<tbody id="filterContent"></tbody>
<!--<tr></tr>-->
</table>
</div>
</body>
<div id="searchwin"></div>
</html>
search.js代码如下：
var colFilter = [['col1','字段1','n'],['col2','字段2','s'],['col3','字段3','s'],['col4','字段4','s'],['col5','字段5','s'],['col6','字段6','d'],['col7','字段7','s']]
var opFilter = [['=','等于'],['<','小于'],['<=','小于等于'],['>','大于'],['>=','大于等于'],['<>','不等于'],['like','近似于']];
var logicFilter = [['and','并且'],['or','或者']];
var contentId = 0;
function findData() {
where = " where (";
var colname = "";
var coltype = "";
var colRealname = "";
var opname = "";
var text = "";
var logicname = "";
for(var i = 0 ; i < contentId ; i++) {
if($('#checkbox'+i)[0] == undefined)
continue;
if($('#text'+i)[0].value == "") {
$.messager.alert('提示', '请填写查询内容', 'info');
return;
}
colname = $('#col'+i)[0].value;
opname = $('#op'+i)[0].value;
text = $('#text'+i)[0].value;
if(opname == "like") {
text = "%"+text+"%";
}
logicname = $('#logic'+i)[0].value;
coltype = getColType(colname);
colRealname = getColRealname(colname);
switch(coltype) {
case "s":
where += colname + " " + opname + " '" + text + "' " + logicname + " ";
break;
case "n":
if(opname != "like") {
text = parseInt($('#text'+i)[0].value);
if(isNaN(text)) {
$.messager.alert('提示',colRealname+'应输入数字','info');
return;
}
where += colname + " " + opname + " " + text + " " + logicname + " ";
} else {
where += colname + " " + opname + " '" + text + "' " + logicname + " ";
}
break;
case "d":
where += "to_date(to_char(" + colname + ",'yyyy-MM-dd'),'yyyy-MM-dd') " + opname + " to_date('" + text + "','yyyy-MM-dd') " + logicname + " ";
break;
default:
$.messager.alert('提示','出现未知数据类型','info');
return;
}
}
where += "1=1)";
alert(where);
closeDiv();
}
function getColType(col) {
for(var i = 0 ; i < colFilter.length ; i++) {
if(colFilter[i][0] == col) {
return colFilter[i][2];
}
}
return undefined;
}
function getColRealname(col) {
for(var i = 0 ; i < colFilter.length ; i++) {
if(colFilter[i][0] == col) {
return colFilter[i][1];
} else {
return undefined;
}
}
}
function addFilter() {
var html = '<tr id="tr' + contentId + '">';
html += '<td>';
html += '<input type="checkbox" id="checkbox' + contentId + '">';
html += '</td>';
html += '<td>';
html += '<select id="col' + contentId + '" class="easyui-combobox" name="col' + contentId + '" style="width:200px;">';
for(var i = 0 ; i < colFilter.length ; i++) {
html += '<option value="' + colFilter[i][0] + '">' + colFilter[i][1] + '</option>';
}
html += '</select>';
html += '</td>';
html += '<td>';
html += '<select id="op' + contentId + '" class="easyui-combobox" name="op' + contentId + '" style="width:200px;">';
for(var i = 0 ; i < opFilter.length ; i++) {
html += '<option value="' + opFilter[i][0] + '">' + opFilter[i][1] + '</option>';
}
html += '</select>';
html += '</td>';
html += '<td>';
html += '<input type="text" id="text' + contentId + '">';
html += '</td>';
html += '<td>';
html += '<select id="logic' + contentId + '" class="easyui-combobox" name="logic' + contentId + '" style="width:200px;">';
for(var i = 0 ; i < logicFilter.length ; i++) {
html += '<option value="' + logicFilter[i][0] + '">' + logicFilter[i][1] + '</option>';
}
html += '</select>';
html += '</td>';
html += '</tr>';
$('#filterContent').append(html);
$('#op'+contentId).attr('value','like');
if(getColType($('#col'+contentId)[0].value) == "n") {
$('#text'+contentId).bind("keypress",function(sender) {
if(isNaN(parseInt(String.fromCharCode(sender.keyCode)))) {
$.messager.alert('提示','请输入数字','info');
return false;
} else {
}
});
}
$('#col'+contentId).bind('change', contentId, function(sender) {
var colType = getColType(this.value);
switch(colType) {
case "s":
$('#text'+sender.data).unbind('click');
$('#text'+sender.data).unbind('keypress');
break;
case "n":
$('#text'+sender.data).bind("keypress",function(sender) {
if(isNaN(parseInt(String.fromCharCode(sender.keyCode)))) {
$.messager.alert('提示','请输入数字','info');
return false;
} else {
}
});
break;
case "d":
$('#text'+sender.data).bind('click', function(){ WdatePicker(); });
break;
default:
$('#text'+sender.data).unbind('click');
$('#text'+sender.data).unbind('keypress');
}
});
contentId += 1;
}
function delFilter() {
var ischeck = 0;
for(var i = 0 ; i < contentId ; i++) {
if($('#checkbox'+i)[0] == undefined)
continue;
if($('#checkbox'+i)[0].checked)
ischeck += 1;
}
if(ischeck == 1) {
var selectId = 0;
for(var i = 0 ; i < contentId ; i++) {
if($('#checkbox'+i)[0] == undefined)
continue;
if($('#checkbox'+i)[0].checked) {
selectId = i;
break;
}
}
$('#tr'+selectId).remove();
} else {
$.messager.alert('提示', '请选择一条数据', 'info');
}
}
function upFilter() {
$.messager.alert('提示', '该功能已被屏蔽', 'info');
}
function downFilter() {
$.messager.alert('提示', '该功能已被屏蔽', 'info');
}
function clearFilter() {
for(var i = 0 ; i < contentId ; i++) {
if($('#checkbox'+i)[0] == undefined)
continue;
$('#tr'+i).remove();
}
contentId = 0;
}
[/size]