西北马二最代码的gravatar头像
西北马二最代码 2017-03-20 09:07:22
接下来会连载一些实用的javascript代码段

接下来,继续我们javascript代码段的学习。

第二讲:禁止输入

      我们有时候会遇到这样一种情况,当有人或者后台机器在输入框中进行恶意输入时,会有一项基本功能,该功能的作用就是禁止其进行继续输入。今天,我们的第一个例子,就是来讲如何利用javascript语言实现禁止输入这个简单的功能。

      首先,码出我们的HTML代码块:

<!--省略其余代码,请自行创建-->
<div>javascript控制<input type = "text" value = "禁止输入"  id = 'forbidInput'></div>

      在盒子中我们嵌套一个文本输入框,将其ID设置为forbidInput,意为禁止输入。

      接下来,我们进行javascript代码的创建:

<script type = "text/javascript">
     window.onload = functon(){
            var _forbidInput = document.getElementById("forbidInput");  //获取响应元素
               _forbidInput.onfocus = function(){  //控制失去焦点的方法
                  _forbidInput.blur(); 
        }
   };
</script>

       接下来,我们对这段简单的javascript代码进行讲解与分析。

       首先,我们建立window.onload(){};事件,该事件的作用是等文档内容完全加载完毕后,包括图片和javascript代码等,才会执行相应的代码,随后,我们声明一个名为_forbidInput的变量名,用来获取我们需要的响应的元素的ID,当我们获取目标元素的ID以后,调用获取焦点的事件onfocus(),此时,我们所确立的焦点,就是在ID为forbidInput的那个HTML定义的输入框,然后,我们用变量名_forbidInput来调用失去焦点的方法blur(),这样,就可以使

我们获取到的那个输入框在遭受恶意输入时可以进行禁止输入的功能。我们再来了解一下blur()方法,简单的说,该方法功能就是使我们失去焦点的,比如说,当我们打开一个搜索引擎用鼠标点击搜索框时,该搜索框就获得了焦点元素,当我们再将光标移到其他地方不再继续点击该搜索框时,这个搜索框也相应的失去了焦点元素,此时,正是blur()方法 大显神通的时刻。简单的说,如果你点击的控件处有焦点,那你便可以在此处进行操作,如果你点击的地方没有焦点或者利用代码段控制使其失去了焦点,那么,你将无法进行任何的操作,这也是我们这个例子所能成功的关键所在。

      ok,我们的第一讲到此结束,希望对各位有所帮助。


打赏
最近浏览
西北马二最代码  LV15 2017年3月20日
顶部 客服 微信二维码 底部
>扫描二维码关注最代码为好友扫描二维码关注最代码为好友