这篇文章主要介绍了php+mysql+jquery查询和列表框选择操作实现过程，需要的朋友可以参考下
本文讲解如何通过ajax查询mysql数据，并将返回的数据显示在待选列表中，再通过选择最终将选项加入到已选区，可以用在许多后台管理系统中。本文列表框的操作依赖jquery插件。
html
说明，html内容是一个表单，里面放置有一个查询输入框，和一个列表框，以及相关按钮。
mysql数据表结构
create table if not exists `t_mult` ( `id` int(11) not null auto_increment, `username` varchar(32) not null, `phone` varchar(20) not null, primary key (`id`) ) engine=myisam default charset=utf8;
表t_mult是一张联系人资料表，包括姓名和手机号码字段。
css
本例中只加载了multiselect插件所需的样式文件，其他css大家可以自行设计。
javascript
首先需要引用本例所需的两个js文件。
接着我们来调用multiselect插件。
$(#lioption).multiselect2side({selectedposition: 'right',moveoptions: false,labelsx: '待选区',labeldx: '已选区' });
然后我们来写搜索按钮进行ajax查询数据的操作。
$(#searchoption).click(function(){var keys=$(#keys).val();$.ajax({type: post,url: action.php,data: title=+keys,success: function(msg){if(msg==1){$(#msg_ser).show().html(没有记录！);}else{$(#lioptionms2side__sx).html(msg);$(#msg_ser).html();}}});$(#msg_ser).ajaxsend(function(event, request, settings){$(this).html();}); });
说明，当点击搜索按钮时，进行的是ajax异步操作，javascript将获取的搜索框的输入值，以post方式传递给后台程序action.php处理，，处理后，返回不同的结果给javascript，如果返回1，html页面会提示“没有记录”，反之，则将结果输出给左边列表框（待选区）：lioptionms2side__sx。注意关键的地方到了，为什么列表框不是xhtml离的lioption，而变成了lioptionms2side__sx了呢？这个要从multiselect插件说起，multiselect插件其实就是将一个列表框装换成左右两个列表框，已供相关操作，通过查看其插件代码不难发现，左边的列表框名为：lioptionms2side__sx，右边列表框（已选区）名为：lioptionms2side__dx，后面会用到。
php
首先来看action.php的处理。
第一步是连接数据库。
$conn=mysql_connect(localhost,root,); mysql_select_db(demo,$conn); mysql_query(set names utf8);
第二步读取数据，并输出。通过检测搜索框传来的值，构造不同的sql语句，并将数据返回输出，代码如下：
$keys=trim($_post['title']); $keys=mysql_real_escape_string($keys,$conn); if(!empty($keys)){$sql=select * from t_mult where username like '%$keys%' or phone='$keys'; }else{$sql=select * from t_mult; } $query=mysql_query($sql); $count=mysql_num_rows($query); if($count>0){while($row=mysql_fetch_array($query)){$str.=.$row['username'].-.$row['phone'].;}echo $str; }else{echo 1; }
最后还有一个提交操作，后台post.php程序来获取最终提交的项的值。
$selid=$_post['lioptionms2side__dx']; if(!empty($selid)){$str=implode(,,$selid);echo $str; }else{echo 没有选择任何项目！; }
注意，我们获取的是右边列表框lioptionms2side__dx的值，而不是lioption的值。
一个查询、操作的例子实现了，但是还有一点点瑕疵，在待选区往已选区添加项目时，如何判断控制已经添加过的项目不能重复添加，这个就留给大家思考吧，试一试有什么好的解决方式。