html:

<div class="configuration">
<form action="" name="myformcon">
<ul>
<li>
<div class="configuration-left">
<div>*</div>
<div><b>监控指标:</b></div>
</div>
<div class="configuration-right">
<input type="radio" name="control" checked><strong>True</strong>
<input type="radio" name="control">False
</div>
</li>
<li>
<div class="configuration-left">
<div></div>
<div><b>FTP IP地址:</b></div>
</div>
<div class="configuration-right">
<input type="text" id="ipname" value="">
<span class=""></span>
</div>
</li>
<li>
<div class="configuration-left">
<div>*</div>
<div><b>转存模式:</b></div>
</div>
<div class="configuration-right">
<select name="" id="">
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
<option value="">4</option>
<option value="">5</option>
<option value="">6</option>
</select>
</div>
</li>
</ul>
<div class="buttongroup">
<button>确定</button> <button>取消</button>
</div> 
</form>
</div>

css:

.configuration form{
width: 100%;
}
.configuration form ul{
margin-bottom: 20px;
}
.configuration ul,.configuration ul>li{
width: 100%;
list-style: none;
overflow: hidden;
margin:0;
padding:0;
}
.configuration{
width: 100%;
overflow: hidden;
}
.configuration-left{
width: 20%;
height: 40px;
line-height: 40px;
float: left;
overflow: hidden;
}
.configuration-left>div{
float:left;
}
.configuration-left>div:nth-of-type(1){
width: 30px;
height: 40px;
line-height: 40px;
text-align: center;
color:red; 
}
.configuration-right{
width:80%;
height: 40px;
float: right;
line-height: 40px;
}
.configuration-right>input[type="radio"]{
width: auto;height: auto;
}
.configuration-right>input,.configuration-right>select{
margin-left: 20px;
margin-right: 5px;
height: 25px;
width: 200px;
}
.configuration-right>span{
visibility:hidden;
}
.configuration-right>.right{
display:inline-block;
width: 20px;
height: 20px;
line-height: 20px;
text-align: center;
border-radius:50%;
background: #40A740;
color: #fff;
}
.configuration-right>.wrong{
display:inline-block;
width: 20px;
height: 20px;
line-height: 20px;
text-align: center;
border-radius:50%;
background:#F73636;
color: #fff;
}
.buttongroup{
width:100%;
margin-top: 20px;
padding-left:220px;
}
.buttongroup>button{
padding-left: 20px;
padding-right:20px;
margin-left: 10px;
margin-right: 10px;
}

js:

$(function(){
$("#ipname").blur(change).keydown(change);
function change(e){
var _val = $(this).val();
if( e.type == "blur" || e.keyCode == 13 ){
e.preventDefault();
var reg = /(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[1-9])(\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|\d)){3}/;
var res = reg.exec(_val);
if( res != null && _val == res[0]) {
$(this).siblings().css("visibility","visible").attr("class","right").text('✔');
} else {
$(this).siblings().css("visibility","visible").attr("class","wrong").text('✘');
}
}
}
})

实现效果:

本文为本人用来记录自己做的一些东西,如有不对的地方,请见谅。    你是我支撑下去的理由

正则表达式判断ip地址的更多相关文章

  1. QT正则表达式---针对IP地址

    判断合法IP的QT正则表达式: bool IsIPaddress(QString ip) { QRegExp rx2("(//d+)(//.)(//d+)(//.)(//d+)(//.)(/ ...

  2. C# 正则表达式判断IP,URL等及其解释

    C# 正则表达式判断IP,URL等及其解释 判断IP格式方法: public static bool ValidateIPAddress(string ipAddress) { Regex valid ...

  3. C# 判断ip地址是否正确

    最后要用一方法判断ip地址是否正确,直接用.Net现成的类,方法如下: string ipStr="192.168.222.333"; IPAddress ip; if(IPAdd ...

  4. 正则表达式检测IP地址与端口号是否合法

    正则表达式检测IP地址与端口号是否合法,代码如下: 正则表达式检测IP地址 public static bool CheckAddress(string s) { bool isLegal = fal ...

  5. 使用正则表达式匹配IP地址

    IP地址分为4段,以点号分隔.要对IP地址进行匹配,首先要对其进行分析,分成如下部分,分别进行匹配:   第一步:地址分析,正则初判 1.0-9 \d 进行匹配 2.10-99 [1-9]\d 进行匹 ...

  6. js判断ip地址,子网掩码,网关的逻辑性检查

    因为要做静态地址配置的js校验,找了好多资料发现网上都是关于ip,mask的有效性检查,没有ip,submask,gateway的逻辑性判断,自己写下代码供需要的人参考. 普及下网关地址知识: 就是进 ...

  7. PHP判断ip地址是否合法

    1.获取真正ip地址 function get_ip(){ //判断服务器是否允许$_SERVER if(isset($_SERVER)){ if(isset($_SERVER[HTTP_X_FORW ...

  8. 判断IP地址是否在指定范围内的方法

    比如给定一个ip段:127.0.0.1 ~ 127.0.0.255,我们想判断一个给定的ip地址是否在此段内,可以先将ip地址转换成整数,然后整数比较大小就很容易了. 例如: 127.0.0.1 = ...

  9. python中利用正则表达式匹配ip地址

    现在有一道题目,要求利用python中re模块来匹配ip地址,我们应如何着手? 首先能想到的是ip地址是数字,正则表达式是如何匹配数字的呢? \d或[0-9] 对于这个问题,不要一下子上来就写匹配模式 ...

随机推荐

  1. ActiveMQ in Action(7) - Wildcards

    关键字: activemq 2.6.7 Wildcards    Wildcards用来支持联合的名字分层体系(federated name hierarchies).它不是JMS规范的一部分,而是A ...

  2. 导入libxml.dylib用Google的GDataXML解析XML数据

    1.用Google的GDataXML来解析XML数据,导入libxml.dylib 2.导入libxml.dylib的操作实现,一开始自己总是找不到libxml.dylib文件. 选择其他文件,到路径 ...

  3. ueditor1.4.3 在IE8下的 BUG

    ueditor1.4.3  .net 版 在IE8 下,多图片上传完成后,点击确认时报错,无法插入图片到编辑器中 原因是 ueditor.all.js 中的 24835 行 if (whitList[ ...

  4. 关于scanf的返回值

    今天写一个小程序时误用while(scanf("%d",&b)!=a),以为scanf的返回值就是输入的值. 其实真相是: scanf返回接收到的变量值的个数. int a ...

  5. 优秀代码要求(转自http://www.cnblogs.com/brishenzhou/p/6284188.html)

    一段优秀的代码,它一般需要满足以下几个条件: #统一规范# 所有的代码,第一前提必须是统一规范,而常见的统一规范主要包括有以下内容: 1)统一编辑器规范 在团队开发中,我们并不对各个开发人员使用的编辑 ...

  6. TinyXML用法小结

    TinyXML用法小结 1.      介绍 Tinyxml的官方网址:http://www.grinninglizard.com 官方介绍文档:http://www.grinninglizard.c ...

  7. Weex-语法笔记 一

    p.p1 { margin: 0.0px 0.0px 2.0px 0.0px; font: 14.0px "PingFang SC Semibold"; color: #45454 ...

  8. 使用Session防止表单重复提交

    本文出处:http://www.cnblogs.com/xdp-gacl/p/3859416.html 在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以 ...

  9. 《JavaScript高级程序设计》读书笔记 ---创建对象

    虽然Object 构造函数或对象字面量都可以用来创建单个对象,但这些方式有个明显的缺点:使用同一个接口创建很多对象,会产生大量的重复代码.为解决这个问题,人们开始使用工厂模式的一种变体. 工厂模式工厂 ...

  10. Jmeter:相应断言介绍

    Jmeter进行性能测试时,作为对上一个请求返回信息的校验,基本上断言是不可少的,今天主要介绍一下Jmeter的相应断言校验. 相应断言:即对服务器相应信息的校验判断,发送http请求后,对服务器返回 ...