wyr123789
- 浏览: 37400 次
- 性别:
-
文章分类
- 全部博客 (57)
- Java 面试 (1)
- html5 (12)
- FQA (1)
- 前端 (18)
- java (1)
- css (7)
- 前端，js，jquery (8)
- html (2)
- jquery，html5，html (2)
- css3 (1)
- 仅包括这些 (0)
- 前端，js，jquery 有效的实时监听input (1)
- esayui (2)
- echarts3 (0)
- from (1)
- linxu (1)
- linxu apr (1)
- jsonp (1)
- 冒泡事件 (1)
- IOS click延迟300秒，ios长按点击事件会有copy的选项 (1)
- js (1)
- vue (1)
- webpack3 (1)
- sass (1)
- node (1)
最新评论
<!DOCTYPE html >
<html>
<head>
<meta charset="utf-8">
<title> Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style>
</style>
</head>
<body>
<select class="textPrepend" autofocus = "autofocus" _multiple = "multiple">
<option value ="">请选择</option>
<!--<option value ="1">周一</option>
<option value ="2">周二</option>
<option value="3">周三</option>
<option value="4">周四</option>-->
</select>
<button class="textclas">提交</button>
<script src="jquery-1.7.2.min.js"></script>
<script>
$(function(){
/*数组添加到下拉列表中
* var _mozi=['墨家','墨子','墨翟','兼爱非攻','尚同尚贤'];
$.each(_mozi,function(key,val){
//回调函数有两个参数,第一个是元素索引,第二个为当前值
var num=key+1;
$('.textPrepend').prepend('<option value ="'+key+'">'+val+'</option>');
})*/
/*json数组读取数据添加到select下拉列表中
* var people = { "programmers": [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]}
people = eval(people.programmers);
for(var i=0; i<people.length; i++)
{
$('.textPrepend').prepend('<option value ="'+[i]+'">'+people[i].firstName+'</option>');
}*/
/*遍历json对象添加到select下拉列表中
* var people= [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]
$.each(people, function(idx, obj) {
$('.textPrepend').prepend('<option value ="'+idx+'">'+obj.firstName+'</option>');
});*/
});
$('.textclas').on('click',function(){
alert('取到的数值是：'+$('.textPrepend').val());
});
</script>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title> Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style>
</style>
</head>
<body>
<select class="textPrepend" autofocus = "autofocus" _multiple = "multiple">
<option value ="">请选择</option>
<!--<option value ="1">周一</option>
<option value ="2">周二</option>
<option value="3">周三</option>
<option value="4">周四</option>-->
</select>
<button class="textclas">提交</button>
<script src="jquery-1.7.2.min.js"></script>
<script>
$(function(){
/*数组添加到下拉列表中
* var _mozi=['墨家','墨子','墨翟','兼爱非攻','尚同尚贤'];
$.each(_mozi,function(key,val){
//回调函数有两个参数,第一个是元素索引,第二个为当前值
var num=key+1;
$('.textPrepend').prepend('<option value ="'+key+'">'+val+'</option>');
})*/
/*json数组读取数据添加到select下拉列表中
* var people = { "programmers": [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]}
people = eval(people.programmers);
for(var i=0; i<people.length; i++)
{
$('.textPrepend').prepend('<option value ="'+[i]+'">'+people[i].firstName+'</option>');
}*/
/*遍历json对象添加到select下拉列表中
* var people= [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]
$.each(people, function(idx, obj) {
$('.textPrepend').prepend('<option value ="'+idx+'">'+obj.firstName+'</option>');
});*/
});
$('.textclas').on('click',function(){
alert('取到的数值是：'+$('.textPrepend').val());
});
</script>
</body>
</html>
分享到：
发表评论
-
vue 倒计时
2019-07-17 17:16 0time: 59, timer: nu ... -
input 特殊处理禁止输入特殊符号或者限制输入中文
2018-06-07 14:46 0<input class="js_input ... -
调用百度的搜索引擎
2017-09-28 11:26 0<!DOCTYPE html> <html& ... -
移动端碰到的坑
2017-09-22 15:34 681不废话 直接上代码： *{ -webkit-touch- ... -
移动端网页布局注意事项及解决
2017-08-01 17:10 11241.winphone系统a、input标签被点击时产生的半透明 ... -
全选反选
2017-05-09 18:34 468<div class="js_mobile&q ... -
js 规格多选，选中显示和还可以选择的数量 多维度选择
2017-03-17 16:09 1057<body> <section class= ... -
发送验证码
2017-03-15 15:54 0<input type="button&quo ... -
common css公共
2020-05-06 11:35 339/*遮罩层*/ .shadow{ position: fixe ... -
图片轮播
2017-03-09 15:56 0<!DOCTYPE html> <html ... -
esayui
2016-10-28 17:12 563$(function(){ $('#peopleGrid') ... -
字符串分割显示
2016-09-20 14:09 503/* 运单号分割显示 */ var oT=document. ... -
功能:H5可根据输入的匹配相对应的文字下拉框
2016-08-29 15:24 584<!DOCTYPE html> <html& ... -
功能 两级联动菜单
2016-08-26 15:13 521<!DOCTYPE html> <html& ... -
功能 交替显示
2016-08-24 16:09 576<!DOCTYPE html> <html& ... -
纯CSS+CSS3右上角倾斜四十五度封页角效果
2016-08-16 17:07 4516加广告与加封页脚的代码是差不多的！ 以前封页脚都是图片现在 ... -
图形笑脸 增加动画
2016-07-21 15:23 566<!DOCTYPE html> <html& ... -
小用例
2016-07-20 17:24 357<!DOCTYPE html> <html& ... -
mui框架 上拉加载 下拉刷新
2016-07-15 15:38 708<!DOCTYPE html> <html& ... -
hcharts视图报表
2016-05-03 14:48 551function queryloginUser() { ...
相关推荐
在网页设计中，`<select>`元素通常用于创建下拉列表，它允许用户从一组预定义的选项中进行选择。然而，传统的`<select>`标签并不支持直接在选项中显示图片，只支持纯文本内容。但随着现代Web技术的发展，我们可以...
在网页设计中，"select级联下拉列表"是一种常见的交互元素，用于创建省市区选择、类别层级展示等场景。这种技术通常结合JavaScript（JS）、HTML5和jQuery库来实现，使得用户能够在多个下拉菜单之间进行联动选择，...
本实例源代码着重讲解了如何利用VBA宏编程技术，在Excel的列表框或下拉列表中选择数据，并将所选内容动态显示在指定的单元格中。这一功能在数据分析、报告生成以及用户交互界面设计中具有广泛的应用。 首先，我们...
在网页设计中，三级下拉列表是一个常见的交互元素，它用于提供多级分类的选择，比如在模拟地区选择时，我们可能会看到省-市-区这样的三层结构。在HTML5中，这种复杂的下拉列表通常结合`<select>`标签、JavaScript...
3. **处理查询结果**：遍历查询结果，并将数据添加到ComboBox中。 4. **关闭数据库连接**：最后，确保数据库连接被正确关闭。 #### 示例代码分析 以下是对给定代码片段的详细解析： ```csharp private void ...
5. **更新DOM**：JavaScript接收到服务器返回的JSON数据后，解析并填充到二级下拉列表中。可以使用`innerHTML`属性或者jQuery的`append()`方法来添加新的选项。 在提供的文件中，"news.sql"可能包含数据库脚本，...
在本主题中，我们将深入探讨如何在VB应用程序中显式地将数据库内容加载到下拉列表中，以便用户能够根据数据库中的数据进行选择。 首先，我们需要连接到数据库。VB支持多种数据库连接方式，如ADO（ActiveX Data ...
select元素代表了下拉列表本身，而option元素则是列表中的各个选项。在级联下拉列表中，通常通过改变option元素来实现动态更新。在HTML DOM中操作select和option时，可以使用诸如document.getElementById获取select...
在下拉列表中实现多选，就是将这种多选功能融入到下拉菜单中，用户可以选择并查看已选的项目。 3. **下拉列表**：下拉列表是网页设计中常见的交互元素，通过点击一个按钮显示或隐藏选项列表。它节省了页面空间，...
综上所述，Select2 是一个功能强大的下拉列表插件，能帮助开发者轻松实现动态模糊查询、多选、分组等功能，提升用户体验。只需正确引入资源、初始化Select2并适当配置，就能将其功能融入到你的网页中。
通过ActionForm对象的`selectedOption`属性，你可以获取用户在下拉列表中选择的值： ```java public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request, ...
在网页设计和开发中，`input`级联下拉列表是一种常见的交互元素，它允许用户在选择一个选项后，根据该选项的值动态地显示相关的第二个或更多下拉列表。这种设计模式通常用于处理层级关系的数据，如国家/地区、省份/...
一旦数据加载完成，我们就可以为每个下拉列表创建`<select>`元素，并为它们添加`onchange`事件监听器。 事件处理是关键部分，因为我们需要监听用户的选择并根据选择更新下一级别的列表。以下是一个简单的示例： ``...
当用户在第一个下拉列表中做出选择，这个选择会被发送到服务器，Servlet接收到请求后查询数据库，找到与之相关的数据，然后将这些数据以JSON或其他格式响应回前端。 接着是Ajax，全称为Asynchronous JavaScript and...
在guns中，select.tag用于处理下拉列表的展示和交互，通过定制化获取数据，我们可以更灵活地控制下拉选项的加载，从而提高应用的响应速度和用户体验。 在guns项目中，"select.tag"的修改版主要是对原始组件进行了...
在窗口Open事件或下拉列表的Getfocus事件中，通过SQL查询获取数据，然后插入到下拉列表中。例如，以下代码示例展示了如何根据hotelid查询p16表，将单位名称添加到下拉列表： ```sql string id, ic int i-op = 1 ...
同时，考虑到性能，数据加载和下拉列表更新应当尽可能高效，避免一次性加载所有数据。 5. 错误处理：在实际应用中，需要考虑数据加载失败或用户选择非法值的情况，进行适当的错误处理和提示。 6. 跨浏览器兼容性：...
当用户选择省份时，会触发一个事件，该事件发送请求到服务器，服务器查询数据库获取对应省份的城市数据，然后将这些数据返回给前端，前端再用这些数据填充城市下拉列表。 在这个项目中，C#可能被用作后台处理语言，...
在本场景中，我们关注的是如何在GridView控件中实现某一列显示下拉列表，并且这个下拉列表的数据来源于数据库的另一张表。GridView控件是ASP.NET中用于显示数据集的强大工具，它允许用户对数据进行查看、编辑和排序...
6. **DOM操作**：使用JavaScript操作DOM，清空市（县）下拉列表，然后根据返回的数据添加新的选项。 7. **最后的联动**：当市（县）下拉列表更新完成后，可以继续监听其`change`事件，以便在用户选择市（县）后，...