腾讯2014年研发职位笔试题Web前端方向简单题第一题。

代码:

<html>
<head>
<title>test JavaScript</title>
<script>
window.onload = function() {
var inputInt = document.getElementById('InputInt');
inputInt.onkeyup = function() {
var num = this.value;
var re =/^[0-9]*[1-9][0-9]*$/;
if (!re.test(num)) {
this.style.color = "red";
} else {
this.style.color = "black";
}
}; } </script>
</head>
<body>
<input id="InputInt" type="number" >
</body>
</html>

用多了jQuery,都差点忘了原生js长什么样了:(

顺便复习一下。

首先,window.onload事件:浏览器加载完DOM后,会通过javascript为DOM元素添加事件。jQuery里面是$(document).ready()

这两者也还是有区别的:

  window.onload $(document).ready()
执行时机 页面所有元素(包括图片及引用文件)加载完后执行

页面内所有HTML DOM, CSS DOM加载完就会执行。

如果想要所有元素(包括图片及引用文件)加载完再注册事件可以用$(window).load(function);等价于window.onload()

可编写个数 只能一个。后写的会覆盖前面写的。 可以同时有多个。

然后就是获取元素,绑定onkeyup函数,在键盘按下放开的时候判断input内的元素是否符合正整数的正则表达式,不符合则文本框内颜色变红,否则颜色为黑。

对正则表达式没有概念的可以看看这:正则表达式30分钟入门教程

JavaScript实现,控制一个文本框只能输入正整数,如输入不符合条件则文本框全部字体标红的更多相关文章

  1. 控制input框只能粘贴,不能输入

    .禁用文本框的onkeydown事件 <input type="text" onkeydown="return false"> .改造,可以使用ct ...

  2. javascript:控制一个元素高度始终等于浏览器高度

    window.onresize = function(){ this.opHtight()} //给浏览器添加窗口大小改变事件window.onresize = function(){ this.op ...

  3. js验证input输入正整数 和 输入的金额小数点后保留两位(PC端键盘输入)

    // 验证开头不为零的正整数 WST.zhengZhengShuIn = function (className){ var rex = /^[1-9]{1}[0-9]*$/;//正整数 $(&quo ...

  4. input输入框只能输入正整数正则

    input输入框加入限制只能输入正整数,输入其他字符会自动清除: <input type="text" value="1" onkeyup="i ...

  5. JS 控制文本框只能输入中文、英文、数字与指定特殊符号

    想做姓名输入的js判断是否是中文,但是网上找的很多是源于一篇文章的,判断中文的正则式不对,后来找到一个可以准确判断了,但是是监测里面有中文的就行,跟我想要的只能输入中文的意思相左,所以又找了下面的 J ...

  6. js控制文本框只能输入中文、英文、数字与指定特殊符号.

    先在'' 里输入 onkeyup="value=value.replace(/[^\X]/g,'')" 然后在(/[\X]/g,'')里的 X换成你想输入的代码就可以了, 中文u4 ...

  7. 用Jquery控制文本框只能输入数字和字母

    用Jquery控制文本框只能输入数字和字母 $.fn.onlyNum = function () { $(this).keypress(function (event) { var eventObj ...

  8. JavaScript 中怎样判断文本框只能输出英文字母、汉字和数字,不能输入特殊字符!

    JS-只能输入中文和英文2008-11-08 10:17在js中用正则表达式对象(RegExp)判断中文 ^[\u0391-\uFFE5]+$英文 ^[A-Za-z]+$中文和英文/^[\u0391- ...

  9. GUI编程笔记(java)09:GUI控制文本框只能输入数字字符案例

    1.首先我们看看我的需求,如下: 控制文本框只能输入数字字符   2.源代码: package cn.itcast_07; import java.awt.FlowLayout; import jav ...

随机推荐

  1. $(...).live is not function

    项目中引入了一个插件,但是调用的时候就报了$(...).live is not function 上网搜索了一下live方法在1.9中被删除了,因为平时自己用的时候就用on的方法,没用过live,所以 ...

  2. 2019-2-19-win10-uwp-客户端如何发送类到-asp-dotnet-core-作为参数

    title author date CreateTime categories win10 uwp 客户端如何发送类到 asp dotnet core 作为参数 lindexi 2019-2-19 9 ...

  3. 干货来了!2019阿里云合作伙伴峰会SaaS加速器专场回顾合集:嘉宾分享、深度解读

    2019年7月26日,在上海举办的阿里云合作伙伴峰会上,阿里云正式发布SaaS生态战略,计划用阿里云的品牌.渠道.资本.方法论.技术加持伙伴,成就亿级营收独角兽. 该生态战略计划招募10家一级SaaS ...

  4. Qt运行不出现界面

    安装Qt之后按照例程运行,结果不出现界面,原因是路径中有中文,将中文全部改成英文之后,问题解决.

  5. INotitypropertyChanged

    WPF数据绑定(要是后台类对象的属性值发生改变,通知在“client界面与之绑定的控件值”也发生改变须要实现INotitypropertyChanged接口) MainWindow.xaml < ...

  6. wpf样式与行为

  7. js控制“鼠标点击按钮后,按钮消失“(可以自己添加video标签控制播放)

  8. Caused by: java.lang.NoClassDefFoundError: org/w3c/dom/ElementTraversal

    学习htmlutil发现报错 完整的引入 <!-- 引入htmlunit --> <dependency> <groupId>net.sourceforge.htm ...

  9. Redis → Windows下搭建redis集群

    一,redis集群介绍 Redis cluster(redis集群)是在版本3.0后才支持的架构,和其他集群一样,都是为了解决单台服务器不够用的情况,也防止了主服务器宕机无备用服务器,多个节点网络互联 ...

  10. 关于java中的异常

    java中有时候要写形如下图中的方法抛出异常 之所以要这么写(要在方法声明行写上throws ...)是因为这种 FileNotFoundException 属于编译异常 不属于运行时异常 不会主动抛 ...