比如你有3个CSS
css1.css2.css3
<%
CssUrl=Request("CssName")
if CssUrl="" then
CssUrl="默认的css"
else
CssUrl=Request("CssName")
End if
%>
加载的时候加载默认的一个随便那个都可以了
<link id="CssInclude" href="<%=CssUrl%>" rel="stylesheet" type="text/css">
然后再下来菜单中
<form name=frm1 method=post>
<select name="CssName" onchange="js:frm1.submit()">
<option value=<%=css1地址%>selected>css1</option>
<!--默认css样式-->
<option value=<%=css2地址%>>css2</option>
<option value=<%=css3地址%>>css3</option>
</select></form>
你是什么写的页面
asp按照我说做
如果是html
<link id="CssInclude" href="默认css地址" rel="stylesheet" type="text/css">
然后再下来菜单中
<form name=frm1 method=post>
<select name="CssName" onchange="document.all.CssInclude.href=this.valuelocation.location.reload()">
<option value=<%=css1地址%>selected>css1</option>
<!--默认css样式-->
<option value=<%=css2地址%>>css2</option>
<option value=<%=css3地址%>>css3</option>
</select></form>
简单的代码实现,仅供参考:
单选框:
<body> <input type="radio" name="sex" value="n" /> <input type="radio" name="sex" value="v" /></body>
复选框:
<body> <input type="checkbox" value="n" /> <input type="checkbox" value="v" /></body>
下拉框:
<body> <select> <option>n</option> <option>n</option> <option>n</option> </select></body>
扩展资料:
css注意事项
1、每个标签的属性设置必须是被一对花括号包含。像下面的样子:
标签
{
属性名称:属性值
}
2、花括号中每个属性值赋值后必须用分号隔开。分号就相当于C#和C中的分号,指示一行语句的结束,加上分号就是和网页的解释器说明这个属性的赋值已经结束了,下面开始一个新的属性的赋值。正确的格式是下面的样子:
标签
{
属性名称1:属性值
属性名称2:属性值
属性名称3:属性值
}
3、关于颜色值。我们在前面的文章中,在设置style时,不论是color属性还是background-color属性,赋值时都是指定的颜色名称。这种方式在网页编程中比较不通用。比较常用的做法是赋16进制值,类似于#RRGGBB这种样式,每一位的取值都是从1到F,每两位对应一类颜色值。具体的颜色值可以在网上搜到。
4、关于字体。我们在style中的font-family中设置字体。有时候我们设置的字体可能用户电脑中没有,这时候我们可以在font-family中设置多个可选字体,用逗号分隔,这样如果前面的字体用户电脑中没有,则可以使用后面的字体进行替换。下面是个例子:
<p sytle="font-family:serif,Cursive,Fantasy">
参考资料来源:百度百科:CSS
1、扩展js类库,在项目中建立一个 js文件,命名为:xxx.js 其代码为
if ('function' !== typeof RegExp.escape){
RegExp.escape = function (s)
{
if ('string' !== typeof s)
{
return s
}
return s.replace(/([.*+?^=!:${}()|[\]\/\\])/g, '\\$1')
}
}
Ext.ns('Ext.form')
Ext.form.MultiSelect = Ext.extend(Ext.form.ComboBox,
{
checkField: 'checked',
multi: true,
separator: ',',
initComponent: function ()
{
if (!this.tpl)
{
this.tpl = '<tpl for=".">' + '<div class="x-combo-list-item">'
+ '<img src="' + Ext.BLANK_IMAGE_URL + '" '
+ 'class="ux-MultiSelect-icon ux-MultiSelect-icon-'
+ '{[values.' + this.checkField + '?"checked":"unchecked"'
+ ']}">'
+ '{[values.' + this.displayField + ']}'
+ '</div>'
+ '</tpl>'
}
Ext.form.MultiSelect.superclass.initComponent.apply(this, arguments)
this.on(
{
scope: this,
beforequery: this.onBeforeQuery,
blur: this.onRealBlur
})
this.onLoad = this.onLoad.createSequence(function ()
{
if (this.el)
{
var v = this.el.dom.value
this.el.dom.value = ''
this.el.dom.value = v
}
})
},
initEvents: function ()
{
Ext.form.MultiSelect.superclass.initEvents.apply(this, arguments)
this.keyNav.tab = false
},
beforeBlur: function ()
{
},
postBlur: function ()
{
},
clearValue: function ()
{
this.value = ''
this.setRawValue(this.value)
this.store.clearFilter()
this.store.each(function (r)
{
r.set(this.checkField, false)
}, this)
if (this.hiddenField)
{
this.hiddenField.value = ''
}
this.applyEmptyText()
},
getCheckedDisplay: function ()
{
var re = new RegExp(this.separator, "g")
return this.getCheckedValue(this.displayField).replace(re, this.separator + ' ')
},
getCheckedValue: function (field)
{
field = field || this.valueField
var c = []
var snapshot = this.store.snapshot || this.store.data
snapshot.each(function (r)
{
if (r.get(this.checkField))
{
c.push(r.get(field))
}
}, this)
return c.join(this.separator)
},
onBeforeQuery: function (qe)
{
qe.query = qe.query.replace(new RegExp(RegExp.escape(this.getCheckedDisplay()) + '[ ' + this.separator + ']*'), '')
},
onRealBlur: function ()
{
this.list.hide()
var rv = this.getRawValue()
var rva = rv.split(new RegExp(RegExp.escape(this.separator) + ' *'))
var va = []
var snapshot = this.store.snapshot || this.store.data
Ext.each(rva, function (v)
{
snapshot.each(function (r)
{
if (v === r.get(this.displayField))
{
va.push(r.get(this.valueField))
}
}, this)
}, this)
this.setValue(va.join(this.separator))
this.store.clearFilter()
},
onSelect: function (record, index)
{
if (this.fireEvent('beforeselect', this, record, index) !== false)
{
record.set(this.checkField, !record.get(this.checkField))
if (this.store.isFiltered())
{
this.doQuery(this.allQuery)
}
if (this.multi)
{
if (record.get("key") == "---" && record.get(this.checkField))
{
this.setValue("---")
}
else
{
this.setValue(this.getCheckedValue())
}
}
else
{
this.clearValue()
this.value = record.get(this.valueField)
this.setRawValue(record.get(this.displayField))
this.list.hide()
}
this.fireEvent('select', this, record, index)
}
},
setValue: function (v)
{
if (v)
{
v = '' + v
if (this.valueField)
{
this.store.clearFilter()
this.store.each(function (r)
{
var checked = !(!v.match('(^|' + this.separator + ')'
+ RegExp.escape(r.get(this.valueField))
+ '(' + this.separator + '|$)'))
r.set(this.checkField, checked)
}, this)
this.value = this.getCheckedValue()
this.setRawValue(this.getCheckedDisplay())
if (this.hiddenField)
{
this.hiddenField.value = this.value
}
}
else
{
this.value = v
this.setRawValue(v)
if (this.hiddenField)
{
this.hiddenField.value = v
}
}
if (this.el)
{
this.el.removeClass(this.emptyClass)
}
}
else
{
this.clearValue()
}
},
selectAll: function ()
{
this.store.each(function (record)
{
record.set(this.checkField, true)
}, this)
this.doQuery(this.allQuery)
this.setValue(this.getCheckedValue())
},
deselectAll: function ()
{
this.clearValue()
}
})
Ext.reg('multiSelect', Ext.form.MultiSelect)
2、在ext-all.css文件最后,加入css样式
.ux-MultiSelect-icon { width:16px height:16px float:left background-position: -1px -1px ! important background-repeat:no-repeat ! important }.ux-MultiSelect-icon-checked { background: transparent url(../images/default/menu/checked.gif) }
.ux-MultiSelect-icon-unchecked { background: transparent url(../images/default/menu/unchecked.gif) }
3、使用
var DepartUserStore=new Ext.data.Store({
proxy: new Ext.data.HttpProxy(
{
url:'/Web/Manage/DeskTop/JSON/ScheduleManager/GetSimpleDepartUserInfo.aspx'
}),
//读取Json
reader: new Ext.data.JsonReader(
{ totalProperty: "totalCount", root: "root" },
[
{name:'UserId',type:'int'},
{name:'UserName',type:'string'}
])
})
var DepartUserCbox = new Ext.form.MultiSelect(
{
fieldLabel: ' 姓名',
labelStyle: 'width:80px',
width: 150,
editable: false,
id: 'DepartUserDS',
hiddenName:'DepartUserIdDS',
store: DepartUserStore,
emptyText: '--请选择--',
allowBlank: false,
blankText: '请选择',
mode:'remote',
displayField: 'UserName',
valueField: 'UserId',
triggerAction: 'all',
selectOnFocus: true,
listWidth: 200
})
DepartUserStore.on('load', function ()
{
DepartUserCbox.selectAll() //全选
})
DepartUserStore.load()