常用jq代码
1. 只允许输入数字,且禁止输入法
<html>
<head>
<script type='text/javascript' src='../../js/jquery.min.js' charset='utf-8'></script>
<script type="text/javascript">
$(function () {
$(".onlyFloat").keydown(function (e) {
if (((event.keyCode > 47) && (event.keyCode < 58)) || (event.keyCode == 8) || ((event.keyCode > 95) && (event.keyCode < 106))|| (event.keyCode == 110)) { // 判断键值
return true;
}
else {
return false;
}
}).focus(function () {
this.style.imeMode = 'disabled'; // 禁用输入法,禁止输入中文字符
});
})
</head>
<body>
<input type="text" class="onlyFloat" />
</body>
</html>
动态添加的输入框无法绑定监听事件，如果还需要限制其输入，就直接在标签中添加onkeydown事件，详见下例
2.只允许输入整数且不能超过某值
<html>
<head>
<script type='text/javascript' src='../../js/jquery.min.js' charset='utf-8'></script>
<script type="text/javascript">
function onlyNum(e) {
var maxnum = 90; //最大值
var oldnum = $(e).val(); //当前文本框中的数字
if ((event.keyCode > 36 && event.keyCode < 41) || (event.keyCode == 8)) {
return true;
}
else if (event.keyCode > 47 && event.keyCode < 58) { // 判断键值
var nownum =parseInt( oldnum + String.fromCharCode(event.keyCode));
if (nownum > maxnum) {
alert(0, "输入后的值大于限定值，不允许该健输入");
return false;
}
else {
return true;
}
}
else if (event.keyCode > 95 && event.keyCode < 106) {
var inputcontent = String.fromCharCode(event.keyCode);
switch (inputcontent) {
case "a": inputcontent="1"; break;
case "b": inputcontent = "2"; break;
case "c": inputcontent = "3"; break;
case "d": inputcontent = "4"; break;
case "e": inputcontent = "5"; break;
case "f": inputcontent = "6"; break;
case "g": inputcontent = "7"; break;
case "h": inputcontent = "8"; break;
case "i": inputcontent = "9"; break;
default: inputcontent = "0"; break;
}
var nownum = parseInt(oldnum + inputcontent);
if (nownum > maxnum) {
alert( "输入后的值大于限定值，不允许该健输入");
return false;
}
else {
return true;
}
}
else {
return false;
}
}
</script>
</head>
<body>
<input type="text" onkeydown="return onlyNum(this)" style="ime-mode:disabled; ">
</body>
</html>
3.radio选中改变触发事件
<html>
<head>
<script type='text/javascript' src='../../js/jquery.min.js' charset='utf-8'></script>
<script type="text/javascript">
$("input[type=radio][name=typestyle]").change(function () {
if (this.id == "radio_bq") {
}
else {
}
})
</script>
</head>
<body>
<input type="radio" name="typestyle" checked="checked" class="k_radio" id="radio_br" />冰刃
<input type="radio" name="typestyle" class="k_radio" id="radio_bq" />兵器
</body>
</html>
4.判断总复选框是否选中,遍历所有子复选框
<html>
<head>
<script type='text/javascript' src='../../js/jquery.min.js' charset='utf-8'></script>
<script type="text/javascript">
//点击全选
function AllCheckClick() {
var isAll = $("#drqAllCheckbox").is(':checked');
$.each($("#drqLeftList > table > tr"), function (k, v) {
var $checkbox = $(v).find("input[type='checkbox']");
if (isAll) {
$checkbox.prop("checked", "true");
} else {
$checkbox.removeAttr("checked");
}
});
}
</script>
</head>
<body>
<input type="checkbox" id="drqAllCheckbox" onclick="AllCheckClick()"/>
<div id="drqLeftList">
<table>
<tr>
<td><input type="checkbox"/></td>
<td></td>
</tr>
<tr>
<td><input type="checkbox"/></td>
<td></td>
</tr>
</table>
</div>
</body>
</html>
5. 打印页面某一块内容（内容块若带滚动条，使用下法不会出现只打印滚动条上部的情况），并去除页眉页脚，页面显示和打印时采用两套css
<html>
<head>
<script type='text/javascript' src='../../js/jquery.min.js' charset='utf-8'></script>
<script type="text/javascript">
function labelPrint(){
if (getExplorer() == "IE") {
pagesetup_null(); //删除打印页面的页眉页脚
}
var printhtml = $("#printdiv").html(); //获取div里的内容，不包括本身
//var printhtml = $("#printdiv").prop("outerHTML"); //获取div的内容，包括本身
var bodyHtml = document.body.innerHTML;
document.body.innerHTML = printhtml;
window.print();
document.body.innerHTML = bodyHtml;
}
//获取当前浏览器
function getExplorer() {
var explorer = window.navigator.userAgent;
//ie
if (explorer.indexOf("MSIE") >= 0) {
return "IE";
}
//firefox
else if (explorer.indexOf("Firefox") >= 0) {
return "Firefox";
}
//Chrome
else if (explorer.indexOf("Chrome") >= 0) {
return "Chrome";
}
//Opera
else if (explorer.indexOf("Opera") >= 0) {
return "Opera";
}
//Safari
else if (explorer.indexOf("Safari") >= 0) {
return "Safari";
}
}
//删除打印页面的页眉页脚
function pagesetup_null() {
var hkey_root, hkey_path, hkey_key;
hkey_root = "HKEY_CURRENT_USER";
hkey_path = "\\Software\\Microsoft\\Internet Explorer\\PageSetup\\";
try {
var RegWsh = new ActiveXObject("WScript.Shell");
hkey_key = "header";
RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "");
hkey_key = "footer";
RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "");
//hkey_key = "margin_left";
//RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "0");
//RegWsh.sendKeys('%fu');
} catch (e) {
}
}
</script>
<style>
@media screen{
/*屏幕显示的css*/
}
@media print{
/*打印采用的css*/
/*@page{
size:A4 portrait;
margin-left:0;
}*/
}
/*公用的css*/
#printdiv{
border:1px solid;
}
</style>
</head>
<body>
<div id="buttonlist"> <a onclick="labelPrint()">打印</a></div>
<div id="printdiv"></div>
</body>
</html>
6.对数据序列化以及反序列化
<html>
<head>
<script type='text/javascript' src='../../js/jquery.min.js' charset='utf-8'></script>
<script src="../../js/json2.js"></script>
<script type="text/javascript">
function getContent(){
var contentlist=[];
var content={
name:$("#").val(),
age:$("#").val()
}
contentlist.push(content);
var contentlistjson=JSON2.stringify(contentlist); //序列化
JSON2.parse(contentlistjson) //反序列化
eval("(" + contentlistjson + ")"); //反序列化
}
</script>
</head>
<body>
</body>
</html>
7.获取单选框的选中值
<html>
<head>
<script type='text/javascript' src='../../js/jquery.min.js' charset='utf-8'></script>
<script type="text/javascript">
var name = $('input:radio:checked').val();
//var name = $("input[type='radio']:checked").val();
//var name = $("input[name='typestyle']:checked").val();
</script>
</head>
<body>
<input type="radio" name="typestyle" checked="checked" class="k_radio" id="radio_br" />冰刃
<input type="radio" name="typestyle" class="k_radio" id="radio_bq" />兵器
</body>
</html>
8.寻找某一元素的值
<html>
<head>
<script type='text/javascript' src='../../js/jquery.min.js' charset='utf-8'></script>
<script type="text/javascript">
function findTd() {
//$.each( $("#drqLeftList tr"),function(k,v){
// var text=$(this).find("td").eq(0).text();
//})
var text=$(#drqLeftList tr:first).find("td").eq(0).text(); //值为00
}
</script>
</head>
<body>
<div id="drqLeftList">
<table>
<tr>
<td>00</td>
<td>01</td>
</tr>
<tr>
<td>10</td>
<td>11</td>
</tr>
</table>
</div>
</body>
</html>
9.操作元素样式(参考：https://www.hellojava.com/a/84.html)
<html>
<head>
<script type='text/javascript' src='../../js/jquery.min.js' charset='utf-8'></script>
<script type="text/javascript">
$(function(){
$("#content").css("background"); //返回元素的背景颜色
$("#content").css("background","#ccc") //设定元素背景为灰色
$("#content").height(300); $("#msg").width("200"); //设定宽高
$("#content").css({ color: "red", background: "blue" });//以名值对的形式设定样式
$("#content").addClass("select"); //为元素增加名称为select的class
$("#content").removeClass("select"); //删除元素名称为select的class
$("#content").toggleClass("select"); //如果存在（不存在）就删除（添加）名称为select的class
})
</script>
</head>
<body>
<div id="content"></div>
</body>
</html>
10.待补充
常用jq代码的更多相关文章
- 工作中总结的常用PHP代码
[目录] ◆PHP常用的代码 ◆HTML常用代码 [值传递 和 引用传递] [单例模式] [魔术常量] [代码调试(自定义一个简单的debug函数)] [thinkphp多表查询] [获取客户端IP地 ...
- IOS开发效率之为Xcode添加常用的代码片段
IOS开发效率之为Xcode添加常用的代码片段 原文地址:http://blog.csdn.net/pingchangtan367/article/details/30041285 tableview ...
- IOS开发－OC学习－常用功能代码片段整理
IOS开发-OC学习-常用功能代码片段整理 IOS开发中会频繁用到一些代码段,用来实现一些固定的功能.比如在文本框中输入完后要让键盘收回,这个需要用一个简单的让文本框失去第一响应者的身份来完成.或者是 ...
- 记录C#常用的代码片段
时间一久,常用的代码会有点忘记,还是贴在这里方便查找! 1.将信息写入文件中 //将字符串写入到文本中 void writeToText(string msg) { try { msg = DateT ...
- 常用 jq 正则 包含手机正则，邮箱正则。。。
常用 jq 正则规则 1.手机 /^1(3|4|5|7|8)\d{9}$/ 2.qq /^[1-9][0-9]{5,10}$/ 3.邮箱 /^\w+((-\w+)|(\.\w+))*\@[ ...
- SAP FI CO模块常用事务代码
...
- 简单的jQ代码
简单的jQ代码 /* * Lazy Load - jQuery plugin for lazy loading images * * Copyright (c) 2007-2012 Mika Tuup ...
- 73种网页常用Javascript代码
73种网页常用Javascript代码 转载自:前端丶灵魂工程师 1.后退 前进 <input type="button" value="后退" o ...
- legend3---lavarel常用操作代码2
legend3---lavarel常用操作代码2 一.总结 一句话总结: 对于王思cong被执法人的感悟:失意时 莫心伤,得意时 莫膨胀 1.lavarel自动事务? DB::transaction方 ...
随机推荐
- awk和sed截取nginx和tomcat时间段日志
1 nginx日志截取示例 日志路径:/usr/local/nginx/logs, 截取access.log中2019年3月24日17点00~02之间的日志: 写法1: cat access.log ...
- 树形结构模型Django-MPTT
什么是django-mptt? django-mptt是一个可复用的django app, 旨在让你自己的django项目模型使用MPTT更加简单.它负责将数据库表作为树型结构管理的详细信息,并提供用 ...
- 为什么ArrayList、LinkedList线程不安全，Vector线程安全
ArrayList源码 public boolean add(E e) { ensureCapacityInternal(size + 1); // Increments modCount!! ele ...
- （五）ORBSLAM关键帧的筛选和插入
ORBSLAM2的关键帧简介 图像插入频率过高会导致信息冗余度快速增加,而这些冗余的信息对系统的精度却十分有限,甚至没有提高,反而消耗了更多的计算资源.这等于吃力不讨好. 关键帧的目的在于,适当地降低 ...
- 第十三节，OPenCV学习（二）图像的简单几何变换
图像的简单几何变换 几何变换不改变图像的像素值,只是在图像平面上进行像素的重新安排 适当的几何变换可以最大程度地消除由于成像角度.透视关系乃至镜头自身原因所造成的几何失真所产生的的负面影响. 一.图像 ...
- Ubuntu下使用Sublime Text 3配置Python开发环境
因为电脑配置有些低端,所以只能使用Sublime来当作Python的IDE. 1.下载Sublime Text 3并安装 首先去官网找到64位的.tar.bz2的压缩文件下载: 使用命令或归档管理器将 ...
- [Kubernetes]容器日志的收集与管理
在开始这篇文章之前,首先要明确一点: Kubernetes 中对容器日志的处理方式,都叫做 cluster-level-logging ,也就是说,这个日志处理系统,与容器, Pod 以及 Node ...
- 019_UT、IT、ST、UAT
软件开发中的完成测试环境所包括的环节包括:UT.IT.ST.UAT UT = Unit Test 单元测试 IT = System Integration Test 集成测试 ST = System ...
- 《Linux就该这么学》 - 必读的红帽系统与红帽linux认证自学手册
<Linux就该这么学> 本书作者刘遄从事于linux运维技术行业,较早时因兴趣的驱使接触到了Linux系统并开始学习. 已在2012年考下红帽工程师RHCE_6,今年又分别考下RHC ...
- Arrays类的运用，二分法，数组的复制，命令行参数的运用，二维数组，Object，equals
/*Arrays jdk中为了便于开发,给开发者提供了Arrays类, 其中包含了很多数组的常用操作.例如快速输出.排序.查找等.*/ import java.util.Arrays; public ...