`

动态生成option下拉列表

json 
阅读更多
<script type="text/javascript">
function getPulldownData() {
//get Data (json format) from database
var tmpRet = {'DATA' : [{'NAME':'computer','NAME_CD':'a0001'},{'NAME':'faxmachine','NAME_CD':'a0002'}] };
//var umearray = ["aa","bb"];
if(tmpRet==null || tmpRet==undefined) {
//exception handling
}

var arr = tmpRet['DATA'];
var ret = document.createDocumentFragment();
for (var i = 0; i < arr.length; i++) {
var o = arr[i];
var newop = document.createElement("option");
newop.id = o['NAME_CD'];
newop.title=o['NAME'];
newop.value = o['NAME_CD'];
newop.appendChild(document.createTextNode(o['NAME'].substring(0,5)));
ret.appendChild(newop);
}
return ret;
}

function loadSel() {
var ret = getPulldownData();
document.getElementById("sel").appendChild(ret);
}
</script>
  </head>
<body onload = "loadSel()">
<select id="sel"></select>   
</body>
分享到：
| frame和iframe的区别
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    js实现动态生成select中的option

    以上就是一个简单的JavaScript动态生成`select`下拉列表的流程。在实际应用中，数据可能来自服务器，或者是通过其他方式动态生成。此外，为了提供更好的用户体验，我们还可以考虑添加加载提示、错误处理等机制。通过...

    下拉列表自动跳转超链接网页

    这里的每个`&lt;option&gt;`元素代表下拉列表中的一个选项，`value`属性则存放对应超链接的URL。注意，我们设置了一个默认选项，其`value`为`#`，表示没有选择任何选项时不会触发跳转。 接下来，我们需要使用JavaScript来...

    网页表单级联下拉列表自动填写方法

    然后，在JavaScript中使用 onchange 事件来监听页面的变化，当用户选择了前一个下拉列表框的选项后，JavaScript就会根据用户的选择来动态生成后一个下拉列表框的选项。 例如，在省市区三级下拉列表框中，当用户选择...

    jsp出生日期三级级联下拉列表

    1. **HTML Select元素**：这是创建下拉列表的基础，`&lt;select&gt;`标签定义了一个下拉列表，而`&lt;option&gt;`标签则定义了列表中的每个选项。 2. **JavaScript事件**：在级联下拉列表中，我们需要监听用户的每次选择，这...

    c#生成EXCEL下拉列表单元格（vs2005版）

    在实际应用中，下拉列表的值可能来自数据库或其他数据源，你可以将这些值动态加载到数据验证的列表中。此外，还可以设置数据验证的其他规则，如输入长度限制、数字范围检查等，以满足更复杂的需求。 总结，通过C#与...

    c# DataGridView中添加下拉列表

    8. 考虑性能：如果数据源很大，或者下拉列表需要动态生成，考虑使用虚拟化技术来提高性能。 总之，通过上述步骤，我们可以在C#的`DataGridView`中添加下拉列表，提供给用户更友好的交互体验。记得在实际应用中根据...

    jQuery实现动态生成年月日级联下拉列表示例

    总之，通过这个示例，我们可以学习到如何使用jQuery动态生成和更新级联的年月日下拉列表，以及如何处理JavaScript中的日期和闰年判断。这个方法适用于各种需要用户选择日期的场景，提高了用户体验并简化了开发过程。

    下拉列表.zip

    此外，可以使用数组来存储下拉列表的选项，并通过`for`循环或者`map()`函数来动态生成HTML元素。如果涉及到数据的实时更新，可能还会用到AJAX请求，从服务器获取或发送数据。 对于前端框架，如React、Vue或Angular...

    jquery简单实现级联下拉列表

    级联下拉列表是指当用户在一个下拉列表中选择某个选项时，会触发另一个或多个下拉列表的更新，以便显示与之相关的选项。这种交互方式可以提高用户体验，简化复杂的数据选择过程。 ### jQuery在级联下拉列表中的应用...

    在struts中实现下拉列表

    有时候，下拉列表的选项需要从数据库或其他源动态获取。这时，你可以在Action或ActionForm的初始化方法中加载选项。例如，你可以在ActionForm的`reset`方法中添加代码： ```java public void reset(ActionMapping ...

    input 级联下拉列表

    当用户选择一个选项时，触发事件处理函数，根据选择的值动态生成或更新第二个下拉列表的内容。 4. **AJAX数据获取**： 通常，级联下拉列表的选项不是静态定义的，而是通过AJAX异步从服务器获取。这使得我们可以...

    php数组生成html下拉列表的方法

    在PHP中，我们可以使用数组来存储下拉列表的选项值，并利用循环结构来动态生成option元素。主要步骤包括定义一个PHP数组，然后通过foreach循环遍历这个数组，并将数组的每个元素插入到option标签的value属性和显示...

    js下拉列表也可以这么使用??有点变态

    在JavaScript的世界里，下拉列表通常指的是...无论是动态生成选项、监听用户选择，还是使用第三方库增强功能，都能让下拉列表变得“有点变态”。在实际项目中，应结合具体需求，灵活运用这些技术和工具，提升用户体验。

    jQuery动态产生select option下拉列表

    jQuery动态产生select option下拉列表的实现方法涉及到了前端技术中的JavaScript库jQuery，通过这个库可以方便地操作DOM元素，实现动态的内容更新。在此过程中，主要利用了jQuery中的创建元素、属性设置、事件绑定等...

    javascript实现通过拼音首字母快速选择下拉列表

    使用`keyup`事件监听输入，然后动态更新下拉列表的可见选项。 ```javascript const filterInput = document.createElement('input'); filterInput.type = 'text'; document.body.appendChild(filterInput); filter...

    数据库三级联动下拉列表

    3. **填充下拉列表**：使用ASP的HTML输出功能，动态生成HTML的`&lt;select&gt;`元素，并将查询到的城市数据作为`&lt;option&gt;`标签的值和文本。 4. **事件监听**：在JavaScript中，为上一级下拉列表添加`onChange`事件监听器...

    Ajax实现下拉列表从数据库读取数据级联

    4. **处理响应**：前端接收到服务器响应后，解析JSON数据，动态生成二级下拉列表的选项。 5. **更新UI**：用新生成的选项替换二级下拉列表的现有内容，使用户看到级联效果。 具体代码示例（使用jQuery和Ajax）： `...

    级联下拉列表

    3. **更新子级下拉列表**：`updateChildSelect`函数根据主级选择的值，动态生成并填充子级下拉列表。 ```javascript function updateChildSelect() { var parentValue = this.value; // 这里可以添加从服务器获取...

    向元素中动态添加option

    在网页开发中，`&lt;select&gt;`元素用于创建下拉列表，常常用于用户选择操作。而动态添加`&lt;option&gt;`是常见的交互设计，特别是在数据量大或者数据需要实时更新的场景中。这篇博客“向元素中动态添加option”探讨的就是如何...

    layui动态渲染生成select的option值方法

    本文档将详细阐述如何使用layui框架，结合jQuery和Ajax技术，动态渲染生成select下拉列表中的option选项值的方法。 首先，我们需要了解layui框架。layui是一个前端UI框架，它为开发者提供了一系列的组件，其中就...

Magicbox
Global site tag (gtag.js) - Google Analytics