<script type="text/javascript" src="jquery-1.3.2.min.js" />
<table boder='1'>
<tr>
<th>待选字段</th>
<td></td>
<th>报表导出字段</th>
</tr>
<tr>
<td><select name="selectOne" size="5" multiple style="height:300px!important; width:150px;">
<?php foreach($arrFieldName as $key=>$val){?>
<option val="<?php echo $key;?>"><?php echo $val;?></option>
<?php }?>
</select></td>
<td style="width:100px; text-align:center;"><input type="button" id="buttonToRight" value="»" style="background:none; width:50px;" />
<br/>
<br/>
<input type="button" value="«" id="buttonToLeft" style="background:none; width:50px;" />
<br/>
<br/>
<input type="button" value="↑" id="buttonToUp" style="background:none; width:50px;" />
<br/>
<br/>
<input type="button" value="↓" id="buttonToDown" style="background:none; width:50px;" />
</td>
<td><select name="selectTwo" size="5" multiple style="height:300px!important; width:150px;">
</select></td>
</tr>
<tr>
<td ></td>
<td><a class="button"><span class="icon icon-output">确认导出</span></a></td>
<td></td>
</tr>
</table>
<script type="text/javascript">
$(function(){
$('#buttonToRight').click(function(){
if($("select[name=selectOne] option:selected").length>0){
$("select[name=selectOne] option:selected").each(function(i){
$("select[name=selectTwo]").append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option"); //从左移到右边
$(this).remove(); //左边的删除
});
}
});
$('#buttonToLeft').click(function(){
if($("select[name=selectTwo] option:selected").length>0){
$("select[name=selectTwo] option:selected").each(function(i){
$("select[name=selectOne]").append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option");
$(this).remove();
});
}
});
$('#buttonToUp').click(function(){
if($("select[name=selectTwo] option:selected").length>0){
$("select[name=selectTwo] option:selected").each(function(i){
$(this).prev().before($(this)); //上移
});
}
});
$('#buttonToDown').click(function(){
if($("select[name=selectTwo] option:selected").length>0){
$("select[name=selectTwo] option:selected").each(function(i){
$(this).next().after($(this));
$(this).insertAfter($(this).next()); //下移
});
}
});
});
</script>
获取select 选中的 text :
$("#ddlRegType").find("option:selected").text();
获取select选中的 value:
$("#ddlRegType ").val();
获取select选中的索引:
$("#ddlRegType ").get(0).selectedIndex;
设置select 选中的索引:
$("#ddlRegType ").get(0).selectedIndex=index;//index为索引值
设置select 选中的value:
$("#ddlRegType ").get(0).value = value;
//select option的数量
("#ddlRegType option").length;
$("#select_id").append("<option value='Value'>Text</option>"); //添加一项option
$("#select_id").prepend("<option value='0'>请选择</option>"); //在前面插入一项option
$("#select_id option:last").remove(); //删除索引值最大的Option
$("#select_id option[index='0']").remove();//删除索引值为0的Option
$("#select_id option[value='3']").remove(); //删除值为3的Option
$("#select_id option[text='4']").remove(); //删除TEXT值为4的Option
清空 Select:
$("#ddlRegType ").empty();