• js获取某个控件的集合并添加属性或事件


       有时候我们要获取一个对象的集合并给此对象添加属性和时间,虽然用cs代码也能实现但总要写一堆的FindControl

    本来我们用的服务器控件在客户端展示出来就是html标签,所以理所当然的我们就可以用js实现这样的功能。以一组asp:TextBox控件为例子。

    界面很简单

     1

    首先我们给这五个textbox控件加上不能为空的value;

    Code
    <script language="javascript">
            document.body.onload 
    = function resets() {
                
    var controls = document.getElementsByTagName('input');
                
    for (var i = 0; i < controls.length; i++) { if (controls[i].type == 'text') {

                                 controls[i].value 
    = "不能为空!"//给指定的text添加value          };
                                     }
                }

            } 

        
    </script>

     现在添加一个onfocus事件(聚焦的时候清空此textbox的值)和一个onblur事件(在离开此textbox的时候验证此文本框是否为空,并提示对话框!)代码如下

    Code
     <script language="javascript">
            document.body.onload 
    = function resets() {
                
    var controls = document.getElementsByTagName('input');
                
    for (var i = 0; i < controls.length; i++) {
                    
    if (controls[i].type == 'text') {
                        controls[i].value 
    = "不能为空!"//给指定的text添加value
                        controls[i].onfocus = function() { this.value = ''; }; //聚焦清空text的值
                        controls[i].onblur = function() {
                            
    if (!this.value.replace(/(^\s*)|(\s*$)/g, "")) {
                                alert(
    this.value + "不能为空");
                                
    this.focus;
                            }
                        };
                        
    //给指定的text添加onblur事件 判断是否为空!
                    }
                }

            } 

        
    </script>

    效果如下:

    效果实现了 但是问题来了 我们的页面上可能还有别的文本框 ,这段js也会对别的文本框有效果,继续改造

    我们可以把这几个文本框放到一个table 或div 里面 通过id 来就能限制此js的作用的范围:

     var controls = document.getElementById('OneTable').getElementsByTagName('input');

    以上仅仅只是说明批量给某类型的服务器控件添加属性或事件,可能还有错误请谅解。

  • 相关阅读:
    关于import和from xx import xx
    Python中import机制
    定制化的IPython配置
    ajax请求封装函数
    ajax-----readyState总结
    console控制台的小问题
    http协议基本知识
    cookie猜数字游戏(下)------------以及cookie使用的不安全之处
    cookie猜数字游戏(上)---------------思路分析(踩坑)
    Cookie隐藏小广告
  • 原文地址:https://www.cnblogs.com/zmxmiss/p/1450482.html
Copyright © 2020-2023  润新知