当前位置: 首页 > news >正文

用JavaScript实现TEXTbox与DropDownList的交互

从DropDownList到TextBox,也就是当DropDownList选择时,把DropDownList的TEXT或VALUE值赋给TEXTBOX

None.gif // ddl是dropdownlist控件的名称,txt是textbox控件的名称
None.gif//
把dropdownlist的Text值赋给TEXTBOX
None.gif
function  DdlSelectedTextToTxt(ddl,txt)
ExpandedBlockStart.gifContractedBlock.gif
... {
InBlock.gif    document.all(txt).value
=document.all(ddl).options[document.all(ddl).selectedIndex].text;
InBlock.gif    
return false;
ExpandedBlockEnd.gif}

None.gif
// 把dropdownlist的VALUE值赋给TEXTBOX
None.gif
function  DdlSelectedTextToTxt(ddl,txt)
ExpandedBlockStart.gifContractedBlock.gif
... {
InBlock.gif    document.all(txt).value
=document.all(ddl).options[document.all(ddl).selectedIndex].value;
InBlock.gif    
return false;
ExpandedBlockEnd.gif}

把方法绑定到 DropDownList的onchange事件上

None.gif ddl.Attributes.Add( " onchange " " return DdlSelectedTextToTxt(' "   +  ddl.ClientID  +   " ',' "   +  txt.ClientID  +   " ') " );

从TextBox到DropDownList,也就是当textbox的值改变时,从DropDownList的text或value中查找最相近的值(下面的代码只是在DropDownList的text中查找),并把DropDownList的TEXT或VALUE值赋给TEXTBOX。

1.先比较textbox与dropdownlist的值

None.gif   // 返回值:bool, ddl所有项与txt.text值进行匹配,若找到返回true,否则返回false
None.gif
 function Match_DdlToTxt(txt,ddl)
ExpandedBlockStart.gifContractedBlock.gif 
... {
InBlock.gif     var returnValue
=false;
InBlock.gif     var txtValue
=document.all(txt).value;
InBlock.gif     
for( i=0;i<document.all(ddl).options.length;i++)
ExpandedSubBlockStart.gifContractedSubBlock.gif     
...{
InBlock.gif         
if(IsMatch(txtValue,document.all(ddl).options[i].text)==true)
ExpandedSubBlockStart.gifContractedSubBlock.gif         
...{
InBlock.gif            document.all(txt).value
=document.all(ddl).options[i].text;
InBlock.gif            document.all(ddl).options[i].selected
=true;
InBlock.gif            returnValue
= true;
InBlock.gif            
break;
ExpandedSubBlockEnd.gif         }

ExpandedSubBlockEnd.gif     }
  
InBlock.gif    
return returnValue; 
ExpandedBlockEnd.gif}
 
None.gif
// 返回值:bool,匹配sValue1与sValue2项,sValue2是否包含sValue1,包含返回true,否则返回false
None.gif
function IsMatch(sValue1,sValue2)
ExpandedBlockStart.gifContractedBlock.gif
... {
InBlock.gif    var index
=sValue2.indexOf(sValue1);
InBlock.gif    
if(index>=0)
ExpandedSubBlockStart.gifContractedSubBlock.gif    
...{
InBlock.gif        
return true;
ExpandedSubBlockEnd.gif    }

InBlock.gif       
return false;
ExpandedBlockEnd.gif}
 

2.设置当textbox中输入是回车键时响应比较查询事件

None.gif function ChkKeyEnterDdl(txt,ddl) 
ExpandedBlockStart.gifContractedBlock.gif
... {
InBlock.gif    
if(event.keyCode==13)
ExpandedSubBlockStart.gifContractedSubBlock.gif    
...{    
InBlock.gif       
if(Match_DdlToTxt(txt,ddl)==false)
ExpandedSubBlockStart.gifContractedSubBlock.gif       
...{
InBlock.gif          alert(
"数据不匹配!");
ExpandedSubBlockEnd.gif       }

InBlock.gif       
return false;
ExpandedSubBlockEnd.gif    }

ExpandedBlockEnd.gif}

3.把方法绑定到textbox的onkeypress事件或onkeydown事件上

None.gif TextBox1.Attributes.Add( " onkeydown " " return ChkKeyEnterDdl(' "   +  txt.ClientID  +   " ',' "   +  ddl.ClientID  +   " ') " );
None.gif
None.gif
None.gif
None.gifTextBox1.Attributes.Add(
" onkeypress " " return ChkKeyEnterDdl(' "   +  txt.ClientID  +   " ',' "   +  ddl.ClientID  +   " ') " );

转载于:https://www.cnblogs.com/lhuser/articles/1460786.html

相关文章:

  • 全脑瘫IT时代(一)
  • 概念模型 逻辑模型 物理模型 区别
  • c# foreach语句循环取各对象
  • 在C#中实现串口通信的方法
  • 如何制作Bat批处理文件
  • Java与.NET间进行Web Service交互的选择
  • include_once()
  • 六问唐骏:不出国能不能成功?
  • [设计制作]我的《Flex第一步QQ群Logo设计方案》
  • Sql Server 跨库查询
  • 让IE的OPTION支持click事件
  • Winform中让回车键完成TAB键的功能
  • Ajax的AutoComplete的使用
  • (zz)子曾经曰过:先有司,赦小过,举贤才
  • [转]电脑高手的140个电脑技巧
  • [原]深入对比数据科学工具箱:Python和R 非结构化数据的结构化
  • 【干货分享】SpringCloud微服务架构分布式组件如何共享session对象
  • canvas 绘制双线技巧
  • HashMap ConcurrentHashMap
  • LintCode 31. partitionArray 数组划分
  • mockjs让前端开发独立于后端
  • PHP 7 修改了什么呢 -- 2
  • PHP 使用 Swoole - TaskWorker 实现异步操作 Mysql
  • Python连接Oracle
  • Vultr 教程目录
  • zookeeper系列(七)实战分布式命名服务
  • Zsh 开发指南(第十四篇 文件读写)
  • 浮现式设计
  • 近期前端发展计划
  • 如何优雅的使用vue+Dcloud(Hbuild)开发混合app
  • 通过npm或yarn自动生成vue组件
  • 微服务框架lagom
  • Android开发者必备:推荐一款助力开发的开源APP
  • ​ 全球云科技基础设施:亚马逊云科技的海外服务器网络如何演进
  • ## 临床数据 两两比较 加显著性boxplot加显著性
  • ###C语言程序设计-----C语言学习(3)#
  • #pragma once
  • (9)YOLO-Pose:使用对象关键点相似性损失增强多人姿态估计的增强版YOLO
  • (C++)八皇后问题
  • (LeetCode 49)Anagrams
  • (Redis使用系列) Springboot 使用redis实现接口幂等性拦截 十一
  • (附源码)springboot教学评价 毕业设计 641310
  • (附源码)springboot掌上博客系统 毕业设计063131
  • (七)理解angular中的module和injector,即依赖注入
  • (十八)devops持续集成开发——使用docker安装部署jenkins流水线服务
  • (转)EOS中账户、钱包和密钥的关系
  • (转)h264中avc和flv数据的解析
  • (转)程序员技术练级攻略
  • *(长期更新)软考网络工程师学习笔记——Section 22 无线局域网
  • .NET Framework 3.5中序列化成JSON数据及JSON数据的反序列化,以及jQuery的调用JSON
  • .NET 命令行参数包含应用程序路径吗?
  • .NET 中 GetHashCode 的哈希值有多大概率会相同(哈希碰撞)
  • .NET 中使用 Mutex 进行跨越进程边界的同步
  • .net安装_还在用第三方安装.NET?Win10自带.NET3.5安装
  • ;号自动换行