项目描述:
图一
如上图所示:在该页面添加认证方式下拉框 初始化为有5个认证方式 可以追加、删除。
图二
如上图所示: 点添加按钮 出来一个弹出框可以取三种认证方式的别名 当点保存时 在图一下拉框自动添加并默认显示该添加的方式
实现代码:
[img]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<link href="/bh/style/middle_style.css" rel="stylesheet" type="text/css"/>
<link href="/bh/style/jquery.datepick.css" rel="stylesheet" type="text/css"/>
<script>
var AuthTypeId1=[
];
$(function(){
$.each(AuthTypeId1,function(i,item){
$("#AuthTypeId").append("<option value='"+item.AuthTypeId+"'>"+item.AuthTypeName+"</option>");;
});
})
<script>
</script>
<title>无标题文档</title>
<style>
input.checkboxsel{float:left;margin-top:6px;margin-top:3px\9;*margin-top:1px}
</style>
</head>
<body scroll="no">
<div class="head-box">
<h3 class="now">基本信息</h3>
<span class="right-fix"></span>
</div>
<div class="whitepagebox" id="tabboxbig">
<div class="grly-box" id="shougongpeizhi">
<table border="0" style="border-left:1px solid #d8d8d8;table-layout:fixed;">
<tbody>
<tr>
<td class="tit2">认证方式:</td>
<td >
<select name="AuthTypeId" id="AuthTypeId" class="autobox">
</select>
<a href="javascript:void(0);" class="btn_four_grly" onclick="__getDialog('#Dialog01')">添加</a>
<a href="javascript:void(0);" class="btn_four_grly" onclick="delete1()">删除</a>
</td>
</tr>
</tbody>
</table>
</div>
<style type="text/css">
.fdialog{width:820px;height:440px;border-radius:5px;}
.fdialog .dialog-bg{width:2000px;height:2000px;background:#036;opacity:0.8;filter:alpha(opacity=80);}
.fdialog .dialog-cont{width:800px;height:420px;overflow:hidden;margin:10px;padding:0;}
.fdialog .dialog-title,.fdialog .dialog-content{width:100%;}
.fdialog .dialog-content{height:380px;border:0;padding:0;}
</style>
<script type="text/javascript">
function __getDialog(obj,s){
var s=localsession;
var ww = $(window).width(), wh = $(window).height();
var ow = $(obj).width(), oh = $(obj).height();
var p = document.documentElement.scrollTop || document.body.scrollTop;
//$(".dialog-bg").css("opacity",0.8);
//$(".dialog-close",obj).click(function(){$(obj).hide()});
$(obj).find("iframe").attr("src","auth_type_openldap1.cgi?"+s);
$(obj).css({
"top":(wh - oh)/2+p > 0 ? (wh - oh)/2+p : 0,
"left":(ww - ow)/2 > 0 ? (ww - ow)/2 :0
}).fadeIn("fast");
$(window).wresize(function(){
var ww = $(window).width(), wh = $(window).height();
var ow = $(obj).width(), oh = $(obj).height();
var p = document.documentElement.scrollTop || document.body.scrollTop;
//$(".dialog-bg").css("opacity",0.8);
//$(".dialog-close",obj).click(function(){$(obj).hide()});
$(obj).css({
"top":(wh - oh)/2+p > 0 ? (wh - oh)/2+p : 0,
"left":(ww - ow)/2 > 0 ? (ww - ow)/2 :0
});
})
}
function reAuthType(v,txt){
$("#AuthTypeId").append("<option value='"+v+"'>"+txt+"</option>").val(v);
}
function delete1(){
var auid=$("#AuthTypeId").val();
$.ajax({
type:"POST",
url:"manager_add.cgi",
data:{auid:auid,session:localsession1,task:1},
success:function(message){
if(message=="success"){
alert('删除成功');
$("#AuthTypeId>option:selected").remove();
return false;
}else if(message=="error"){
alert('系统认证名称,无法删除');
return false;
}else{
alert('删除失败');
return false;
}
}
});
}
function closeDialog(obj){
$(obj).hide();
}
</script>
</body>
</html>
[/img]
- 大小: 15.8 KB
- 大小: 19.4 KB
分享到:
相关推荐
参考别人文献 同时结合实际修改部分代码做出的一个可编辑的下拉框,并且修改过程同时会动态把没有的选项加入到下拉框中
winform 页面 下拉框 省市联动选择 demo 小功能组件 选择省后,市选项就自动变为该省内的选项
jQGrid动态填充select下拉框的选项值(动态填充)
使用javascript代码写的,两个下拉框,可以实现从左边的下拉框移动任意个选项到右边下拉框,右边的也可以移到左边。
两个下拉列表数据左右移动.(按“SHIFT、CTRL”可以多选项移动)
经验-如何在Excel2019及更高版本中设置下拉框选项.docx
利用Axure的动态面板和中继器实现下拉框选项功能,文件为用例,可以结合文章和实际用例完成这个功能,方便产品经理在制作Axure原型图时完成一些简单的交互功能
参照 http://blog.csdn.net/psp0001060/article/details/49388459 主要介绍javascript动态追加或减少下拉框,以及对应Java端接受新追加的下拉框参数。
选择不同的下拉框跳到不同的页面,使用JavaScript实现的下拉框跳到不同页面效果!
DELPHI7 DBGRIDEH下拉框,目前没解决录入自动下拉 ,如果有人知道的话告诉一下,谢谢! EhLib5.2.84
下拉框是常用的一种web页面控件。它很简单实用,便于 操作者从…组选项中选择适合的选项。一般的下拉框选项是在 页面编写过程中事先写好的,但有时这样不能满足要求。假设 有两个下拉框,一个是省份,一个是...
下拉框中的选项太多需要一个搜索功能的输入框,检索出需要的选项选择,这个插件就是在下拉选中中的第一个选项的前面添加一个搜索框,搜索需要的选项!
在我们浏览网页的时候经常会碰到下拉框,WebDriver提供了Select类来处理下拉框,详情请往下看: 本章中用到的关键方法如下: select_by_value():设置下拉框的值 switch_to.alert.accept():定位并接受现有警告框...
select下拉框,按下空格键后让它的选项显示出来,按回车键选中值
* 2)用户只要输入下拉框选项每字的第一五笔或者拼音码,诱导框就会将最先匹配的n条记录 * (这个参数可以配置,由MAX_MATCH_COUNT来指定),显示在弹出框(窗口大小可以通过POPUP_WIDTH, * POPUP_HEIGHT参数设置)中...
jquery 多选项下拉框,文本点击出现下拉panel ,上面有多选项,可多选择。
下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化下拉框美化
可以输入的下拉框. 下拉框和文本框组合共用可以输入的下拉框. 下拉框和文本框组合共用可以输入的下拉框. 下拉框和文本框组合共用可以输入的下拉框. 下拉框和文本框组合共用可以输入的下拉框. 下拉框和文本框组合共用...
javascript代码模块之用下拉框实现页面跳转
主要介绍了JavaScript实现两个select下拉框选项左移右移功能,js实现下拉框元素互相移动,具有一定的参考价值,感兴趣的小伙伴们可以参考一下