权作记录
0)引入:
<script type="text/javascript" src="scripts/jquery.min.js"></script>
1)根据id获得组件:
// 已知<input Id="input_a" />,获得此input的脚本为: $('#input_a')
var value_a=$('#input_a').val();3)根据id对组件进行赋值:
$('#input_a').val("value_a");
document.getElementById("input_a").innerText="value_a";4)定义click事件:
// 已知<input type="button" id="btn" /> // 定义click事件如下: $(function(){ $('#btn').click(function(){ // do some thing }); });5)在用户输入输入框数据后,检查数据:
$(function(){ /** * 在输入数据后进行检查或做其他操作 */ $("#input_a").blur(function(){ // do some thing }); });6)显示和隐藏div
首先定义html组件:
<div id="div_info" style="display:none"></div>当用户触发了需要显示div_info组件的请求时,使用下面的代码显示div组件:
$('#div_info').show();7)根据行数和列数以及表创建动态表格:
在html中定义表组件:
<table id="tab_dynamic"></table>在js中定义创建方法:
function createTable(tabId,col,row){ // var tab =$('#'+tabId); var tab=tabId; for(var i=0;i<row;i++){ var $row = $('<tr></tr>'); for(var j=0;j<col;j++){ var $col = $('<td><input/></td>'); $col.appendTo($row); } $row.appendTo(tab); } }其调用方法为:
// 动态创建一个4*3的表格 createTable($('#tab_dynamic',3,4));注: 此动态表格的创建可以借鉴,其他动态组件的创建也可以使用此种方法;
8)检查是否可以字符串转为数字:
function canStringtoInt( str){ var num = parseInt(str); if(isNaN(num)){ alert("输入必须是一个数字!"); return false; } return num; }9)ajax异步提交:
$.ajax({ url:'./userAction', data:{args1:"args1"}, dataType:'json', success:function(r){ // do some thing } });后台的action或者controller,使用下面的方式发送数据:
PrintWriter out=null; out = response.getWriter(); // out.println(info); out.flush(); out.close(); return null;// return null 是必须的
/** * 获得每个Table的值 * 每个table里面的行使用分号分隔,每行中的元素使用逗号分隔 */ function getTableArray(tab){ var dataArr=""; $("tr",tab).each(function(){ var row =$(this); $("td",row).each(function(){ dataArr=dataArr+$(this).find('input').val().trim()+","; }); dataArr=dataArr.substring(0, dataArr.length-1)+";"; }); return dataArr.substring(0, dataArr.length-1); }11)遍历div下面的所有table的值:
$("table",$('#div_sub')).each(function(){ // 把table换为其他组件,同样可以遍历 var $tab =$(this); dataAllInputs+=getTableArrayFirst($tab); dataAllInputs+=";"; });
12)父级、同级、下级(摘自http://zzstudy.offcn.com/archives/12921):
jQuery.parent(expr) 找父亲节点,可以传入expr进行过滤,比如$(“span”).parent()或者$(“span”).parent(“.class”) jQuery.parent(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素 jQuery.children(expr).返回所有子节点,这个方法只会返回直接的孩子节点,不会返回所有的子孙节点 jQuery.contents(),返回下面的所有内容,包括节点和文本。这个方法和children()的区别就在于,包括空白文本,也会被作为一个 jQuery对象返回,children()则只会返回节点 jQuery.prev(),返回上一个兄弟节点,不是所有的兄弟节点 jQuery.prevAll(),返回所有之前的兄弟节点 jQuery.next(),返回下一个兄弟节点,不是所有的兄弟节点 jQuery.nextAll(),返回所有之后的兄弟节点 jQuery.siblings(),返回兄弟姐妹节点,不分前后 jQuery.find(expr),跟jQuery.filter(expr)完全不一样。jQuery.filter()是从初始的jQuery对象集合中筛选出一部分,而jQuery.find()的返回结果,不会有初始集合中的内容,比如$(“p”),find(“span”),是从元素开始找,等同于$(“p span”)
13) easyui window 设置title
$('#win').window('setTitle','new title');
14) juqery input 可用与否
$('#inputId').attr('disabled',false); $('#inputId').attr('disabled',true);
14) jquery 获取checkbox状态
$('#checkboxId').click(function() { if(this.checked){ console.info("checked"); }else{ console.info("not checked"); } console.info("filter:"+filter); });
分享,成长,快乐
转载请注明blog地址:http://blog.csdn.net/fansy1990