- 浏览: 277233 次
- 性别:
- 来自: 北京
-
文章分类
最新评论
-
18335864773：
还是用pageoffice生成excel把。生成excel后不 ...
Servlet 生成excel 并下载JXL方式 -
lliiqiang：
适当处理把条件放到查询中，有特殊情况确实需要特殊处理
lucene 多条件查询 -
chendiego：
不对，1212应该射手，返回水瓶
JAVA计算星座 -
xinming521：
img.attachEvent("onerror&q ...
js验证是否是图片 -
xzorrox3：
谢谢，又小学了一招儿。
页面图片加载失败时自动替换
<select id="ddlResourceType" onchange="getvalue(this)">
</select>
动态删除select中的所有options：
document.getElementById("ddlResourceType").options.length=0;
动态删除select中的某一项option：
document.getElementById("ddlResourceType").options.remove(indx);
动态添加select中的项option:
document.getElementById("ddlResourceType").options.add(new Option(text,value));
上面在IE和FireFox都能测试成功，希望以后你可以用上。
其实用标准的DOM操作也可以，就是document.createElement，appendChild，removeChild之类的。
取值方面
function getvalue(obj)
{
var m=obj.options[obj.selectedIndex].value
alert(m);//获取value
var n=obj.options[obj.selectedIndex].text
alert(n);//获取文本
}
==============================================================================
1 检测是否有选中
if (objSelect.selectedIndex > - 1 ) {
// 说明选中
} else {
// 说明没有选中
}
2 删除被选中的项
objSelect.options[objSelect.selectedIndex] = null ;
3 增加项
objSelect.options[objSelect.length] = new Option( " 你好 " , " hello " );
4 修改所选择中的项
objSelect.options[objSelect.selectedIndex] = new Option( " 你好 " , " hello " );
5 得到所选择项的文本
objSelect.options[objSelect.selectedIndex].text;
6 得到所选择项的值
objSelect.options[objSelect.selectedIndex].value;
下面是一个JS填充示例，大家修改一下就可以用了
<script language="javascript" type="text/javascript">
function xlbchange(s){
switch (s){
case "1" :
document.getElementById("lb").options.length=0;
var soojsvalue=[0,1,2,3];
var soojs_text=["精神提炼","作风设计","目标设置","理念提升"];
for ( var i=0;i<soojs_value.length;i++){
var oOption = document.createElement("OPTION");
oOption.value=soojs_value[i];
oOption.text=soojs_text[i];
zpmange.lb.options.add(oOption);
}
break;
case "2" :
document.getElementById("lb").options.length=0;
var soojsvalue=[0,1,2,3,4,5,6,7];
var soojs_text=["校徽","校训","校歌","校名字体","校史展室","宣传画册","宣传光盘","办公用品纪念品"];
for ( var i=0;i<soojs_value.length;i++){
var oOption = document.createElement("OPTION");
oOption.value=soojs_value[i];
oOption.text=soojs_text[i];
zpmange.lb.options.add(oOption);
}
break;
case "3":
document.getElementById("lb").options.length=0;
var soojsvalue=[0,1,2,3];
var soojs_text=["校园景观设计","校园雕塑设计","校园浮雕设计","走廊文化设计"];
for ( var i=0;i<soojs_value.length;i++){
var oOption = document.createElement("OPTION");
oOption.value=soojs_value[i];
oOption.text=soojs_text[i];
zpmange.lb.options.add(oOption);
}
break;
case "4":
document.getElementById("lb").options.length=0;
var soojsvalue=[0,1,2];
var soojs_text=["学校制度","文化活动","行为规范"];
for ( var i=0;i<soojs_value.length;i++){
var oOption = document.createElement("OPTION");
oOption.value=soojs_value[i];
oOption.text=soojs_text[i];
zpmange.lb.options.add(oOption);
}
break;
default :
document.getElementById("lb").options.length=0;
var oOption = document.createElement("OPTION");
oOption.value=0;
oOption.text="请选择作品类别";
zpmange.lb.options.add(oOption);
}
}
</script>
下面是我写的一个小例示供参考，经测试成功
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script LANGUAGE="JavaScript" type="text/javascript">
function xlbChange(s,array_value,array_text)
{
var obj=document.getElementById(s);
obj.options.length=0;
for(var i=0;i<array_value.length;i++)
{
var oOption=document.createElement("option");
oOption.value=array_value[i];
oOption.text=array_text[i];
obj.options.add(oOption);
}
}
function ssyj(s)
{
var arrayvalue=[1,2,3,4];
var array_text=["北京大学","郑州大学","武汉大学","中南大学"];
xlbChange(s,array_value,array_text);
}
function cheach(obj)
{
var m=obj.options[obj.selectedIndex].value;
alert("value"+m);
var v=obj.options[obj.selectedIndex].text;
alert("text"+v);
}
</script>
<BODY onload="ssyj('objselect')">
学校：
<select name="objselect" id="objselect" onchange="cheach(this)" ></select>
专业：
<select name="objselect1" id="objselect1"></select><br/>
<input type="button" Value="提交"/>
</BODY>
</HTML>
发表评论
-
js 表单验证
2012-09-04 15:51 881关键字:js验证表单大全,用JS控制表单提交 ,javascr ... -
页面图片加载失败时自动替换
2010-11-18 09:02 1819在web页面中当图片实效或者图片加载失败时图片位置会出现一个红 ... -
select options remove的问题 js
2010-10-14 14:38 1983options remove的问题 很多朋友习惯用oS ... -
JS判断图片大小
2010-08-16 00:53 2051<input type="text" ... -
JS 无缝细滚动火狐兼容
2010-08-13 11:51 1524<head> <meta http-equ ... -
JS 定时显示内容
2010-08-05 15:18 1363<HTML><HEAD><TIT ... -
JS 幻灯片(左边大图右边小图)
2010-03-23 13:05 2655<!DOCTYPE html PUBLIC " ... -
JS不间断循环滚动
2010-03-13 09:26 1469<html><BODY leftMargin ... -
js 如何将字符串数字(包括小数)转换为数值?
2010-01-19 14:14 2756ECMAscriptt提供了两种把非数字的原始值转换成数字的方 ... -
js 正则表达式-2 整数，浮点数等数字
2010-01-19 14:07 9902js判断输入是否为正整数、浮点数等数字的函数 .下面列出 ... -
JS万年历
2010-01-19 02:42 1388一款很好的JS万年历 -
Ajax的十大框架(不分排名)
2010-01-19 02:24 815No1—Prototype 特点 ... -
js 去除空格与换行
2009-12-13 18:23 9630//去除空格 String.prototype.Trim = ... -
js 获取FCK的值并赋值
2009-12-13 18:13 2224<script language="javas ... -
JS 手机，邮箱，邮编，坐机等常见验证
2009-12-12 23:39 3000JS函数验证总结 //验证是否为整数，包括正负数； fun ... -
JS控制键盘输入数字
2009-12-12 23:36 4726能控制键盘输入的时候只能输入数字 邮编： <input ... -
JS输入数字与小数
2009-12-11 16:17 1339JS判断只能是数字和小 ... -
JS跳转页面参考代码大全
2009-12-01 14:14 1343JS跳转页面参考代码 第一种： <script ... -
js验证是否是图片
2009-11-23 12:51 2445<HTML> <HEAD> < ... -
鼠标点击文本框内文字就消失
2009-09-24 11:19 3641<html> <head> <t ...
相关推荐
在某些场景下，我们需要动态地填充select下拉框的选项值，以实现更灵活的数据输入。本篇文章将详细探讨如何在jQGrid中实现这一功能。 首先，理解`select`下拉框的基本概念。在HTML中，`<select>`元素用于创建一个...
在JavaScript（JS）编程中，动态添加Select中的Option元素值是一项常见的需求，特别是在网页交互或者数据填充时。这里我们将深入探讨如何实现这个功能，并提供一个实际的案例来演示这一过程。 首先，我们要理解HTML...
在本文中，我们将深入探讨如何使用`template-web.js`模板库实现一个动态的二级联动`select`效果。这个实例提供了一个完整的解决方案，适用于那些希望通过JavaScript和模板引擎优化前端交互体验的开发者。 `template...
标题提到的“动态加载select标签下拉框数据”是指在用户交互时，根据需求动态地从服务器获取并填充HTML `<select>` 标签的选项，而不是一次性加载所有数据。这种技术常用于大数据量的下拉列表，以减少初始页面加载...
回调函数中的data参数包含了从服务器返回的数据，可以用来更新DOM元素，例如遍历data数组，并创建新的option元素填充到select中。 知识点四：创建新的DOM元素 在回调函数中，使用$("<option/>").text(item.name)....
总结起来，"select多级动态联动"是网页交互设计中的一种常见技术，通过JavaScript或前端框架来实现。它提高了用户体验，使得用户能更直观地操作层级结构数据。在实际应用中，可以根据项目需求选择合适的实现方式，...
通过以上步骤，我们就完成了C#后端接口与前端AJAX的结合，实现了动态填充select下拉框的功能。在实际项目中，可能还需要考虑其他因素，如跨域问题、请求头的设置、数据的分页与过滤等，但这个基本流程涵盖了最核心的...
在表单动态填充的场景中，JavaScript可以获取用户输入的信息、服务器返回的数据或者存储在浏览器中的数据（如Cookie或localStorage），然后自动填充到表单的各个字段中。这提高了用户的效率，尤其是当用户需要多次...
在HTML和JavaScript编程中，`<select>`元素用于创建下拉列表，经常需要进行动态操作，比如添加、删除、修改选项，以及选中和清空选中的值。本篇文章将探讨如何通过JavaScript来实现这些功能，并判断控件是否存在。...
- **填充省份下拉**：将所有省份作为`<option>`元素添加到省份`<select>`中。 - **事件监听**：为省份`<select>`添加`change`事件监听器。当用户选择一个省份时，触发事件处理函数。 - **动态加载城市**：在事件...
本文将深入探讨两个常见的前端优化技术：动态过滤填充input框和用弹出层替换select框。 首先，动态过滤填充input框是一种提升用户输入效率的策略。在用户在input框中输入时，系统实时根据输入内容动态过滤并显示...
在`<select>`元素中，EL可以用来动态地填充选项。例如，你可以使用EL从JavaBean的集合属性中获取值并将其转化为`<option>`标签： ```jsp <select> ${bean.optionsList}" var="option"> ${option.value}">${option...
在实际开发过程中，我们可能会遇到一个常见问题，即当动态地给`a-select`的`option`赋值后，其`placeholder`属性失效，不再显示默认提示文本。这个问题通常出现在数据异步加载的情况下，比如从服务器获取数据并填充...
- `selectTree.js`：主要的JavaScript代码，实现了SelectTree的功能。 - `selectTree.css`：样式文件，定义了控件的外观。 - `example.html`：示例页面，展示了如何在实际项目中使用这个控件。 - `data.json`：可能...
`XMLHttpRequest`或`fetch`API可用于异步获取数据，并动态填充`<select>`。这在大型应用中常见，以提高页面加载速度。 10. **表单提交与验证** 在表单提交时，`<select>`的值会被包含在表单数据中。可以通过...
然后在JavaScript中解析这些数据，动态创建包含图片的DOM元素。 4. **jQuery实现**： 描述中的`$("#***").select()`可能是引用了jQuery的`select`方法，但这在jQuery中并不存在。可能是指使用jQuery来操作`select`...
接下来，我们需要编写JavaScript代码来初始化并填充下拉树。layui的API提供了`form.on('select(name)', callback)`方法监听选择事件，这里的`name`对应`lay-filter`属性值。在回调函数中，我们可以获取到选中的节点...
2. **初始化`select2`**：通过JavaScript调用`select2()`函数，将普通的`<select>`元素转换为`select2`选择器。 3. **配置参数**：`select2`提供了丰富的配置选项，例如设置搜索的最小字符数、多选的分隔符等，根据...
在Web前端开发中，HTML的`<select>`元素可以通过JavaScript动态填充： ```javascript var select = document.getElementById('mySelect'); for (var i = 0; i ; i++) { var option = document.createElement('...