-----------------------------------------------------------------------
jQuery:
ready()==onload
$(document).ready(function(){});==$().ready(function(){});==$(function(){});
提示：ready() 函数不应与 <body onload=""> 一起使用。
-----------------------------------------------------------------------
jQuery ajax-get():
语法:$(selector).get(url,data,success(response,status,xhr),dataType)
参数: 描述:
url 必需。***规定将请求发送到哪个 URL。***
data 可选。规定连同请求发送到服务器的数据。
success(response,status,xhr) 可选。规定当请求成功时运行的函数。
response - 包含来自请求的结果数据
status - 包含请求的状态
xhr - 包含 XMLHttpRequest 对象
dataType 可选。规定预计的服务器响应的数据类型。
可能的类型："xml";"html";"text";"script";"json";"jsonp"
等价于:
$.ajax({
url:url,
data:data,
success,success,
dataType:dataType
});
reg:
请求 test.php 网页，忽略返回值：
$.get("test.php");
reg:
请求 test.php 网页，传送2个参数，忽略返回值：
$.get("test.php",{name:"John",time:"2pm"});
reg:
显示 test.php 返回值(HTML 或 XML，取决于返回值)：
$.get("test.php",function(data){
alert("Data Loaded:"+data);
});
reg:
显示 test.cgi 返回值(HTML 或 XML，取决于返回值)，添加一组请求参数：
$.get("test.cgi",{name:"John",time:"2pm"},function(data){
alert("Data Loaded"+data);
});
----------------------------------------------------------------------------------
$.ajax():
1.url:
要求为String类型的参数，（默认为当前页地址）发送请求的地址。
2.type:
要求为String类型的参数，请求方式（post或get）默认为get。注意其他http请求方法，例如put和delete也可以使用，但仅部分浏览器支持。
3.timeout:
要求为Number类型的参数，设置请求超时时间（毫秒）。此设置将覆盖$.ajaxSetup()方法的全局设置4.async:
要求为Boolean类型的参数，默认设置为true，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为false。注意，同步请求将锁住浏览器，用户其他操作必须等待请求完成才可以执行。
5.cache:
要求为Boolean类型的参数，默认为true（当dataType为script时，默认为false），设置为false将不会从浏览器缓存中加载请求信息。
6.data:
要求为Object或String类型的参数，发送到服务器的数据。如果已经不是字符串，将自动转换为字符串格式。get请求中将附加在url后。防止这种自动转换，可以查看 processData选项。对象必须为key/value格式，例如{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。如果是数组，JQuery将自动为不同值对应同一个名称。例如{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2。
7.dataType:
要求为String类型的参数，预期服务器返回的数据类型。如果不指定，JQuery将自动根据http包mime信息返回responseXML或responseText，并作为回调函数参数传递。可用的类型如下：
xml：返回XML文档，可用JQuery处理。
html：返回纯文本HTML信息；包含的script标签会在插入DOM时执行。
script：返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时（不在同一个域下），所有post请求都将转为get请求。
json：返回JSON数据。
jsonp：JSONP格式。使用SONP形式调用函数时，例如myurl?callback=?，JQuery将自动替换后一个“?”为正确的函数名，以执行回调函数。
text：返回纯文本字符串。
8.beforeSend：
要求为Function类型的参数，发送请求前可以修改XMLHttpRequest对象的函数，例如添加自定义HTTP头。在beforeSend中如果返回false可以取消本次ajax请求。XMLHttpRequest对象是惟一的参数。
function(XMLHttpRequest){
this; //调用本次ajax请求时传递的options参数
}
9.complete：
要求为Function类型的参数，请求完成后调用的回调函数（请求成功或失败时均调用）。参数：XMLHttpRequest对象和一个描述成功请求类型的字符串。
function(XMLHttpRequest, textStatus){
this; //调用本次ajax请求时传递的options参数
}
10.success：要求为Function类型的参数，请求成功后调用的回调函数，有两个参数。
(1)由服务器返回，并根据dataType参数进行处理后的数据。
(2)描述状态的字符串。
function(data, textStatus){
//data可能是xmlDoc、jsonObj、html、text等等
this; //调用本次ajax请求时传递的options参数
}
11.error:
要求为Function类型的参数，请求失败时被调用的函数。该函数有3个参数，即XMLHttpRequest对象、错误信息、捕获的错误对象(可选)。ajax事件函数如下：
function(XMLHttpRequest, textStatus, errorThrown){
//通常情况下textStatus和errorThrown只有其中一个包含信息
this; //调用本次ajax请求时传递的options参数
}
12.contentType：
要求为String类型的参数，当发送信息至服务器时，内容编码类型默认为"application/x-www-form-urlencoded"。该默认值适合大多数应用场合。
13.dataFilter：
要求为Function类型的参数，给Ajax返回的原始数据进行预处理的函数。提供data和type两个参数。data是Ajax返回的原始数据，type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。
function(data, type){
//返回处理后的数据
return data;
}
15.global：
要求为Boolean类型的参数，默认为true。表示是否触发全局ajax事件。设置为false将不会触发全局ajax事件，ajaxStart或ajaxStop可用于控制各种ajax事件。
16.ifModified：
要求为Boolean类型的参数，默认为false。仅在服务器数据改变时获取新数据。服务器数据改变判断的依据是Last-Modified头信息。默认值是false，即忽略头信息。
17.jsonp：
要求为String类型的参数，在一个jsonp请求中重写回调函数的名字。该值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分，例如{jsonp:'onJsonPLoad'}会导致将"onJsonPLoad=?"传给服务器。
18.username：
要求为String类型的参数，用于响应HTTP访问认证请求的用户名。
19.password：
要求为String类型的参数，用于响应HTTP访问认证请求的密码。
20.processData：
要求为Boolean类型的参数，默认为true。默认情况下，发送的数据将被转换为对象（从技术角度来讲并非字符串）以配合默认内容类型"application/x-www-form-urlencoded"。如果要发送DOM树信息或者其他不希望转换的信息，请设置为false。
21.scriptCharset：
要求为String类型的参数，只有当请求时dataType为"jsonp"或者"script"，并且type是GET时才会用于强制修改字符集(charset)。通常在本地和远程的内容编码不同时使用。
22.顺便说一下$.each()函数:
$.each()函数不同于JQuery对象的each()方法，它是一个全局函数，不操作JQuery对象，而是以一个数组或者对象作为第1个参数，以一个回调函数作为第2个参数。回调函数拥有两个参数：第1个为对象的成员或数组的索引，第2个为对应变量或内容。
/*
*根据名称与值，获取请求响应数据中的某部分
*@Param d为请求响应后的数据
*@Param n为数据中文说明字符
*@Param d为数据在响应数据中的元素名称
*/
reg:
$(function(){
$('#send').click(function(){
$.ajax({
type:"GET",
url:"test.json",
data:{username:$("#username").val(),$("content").val()}
dataType:"json",
success:function(data){////传回请求响应的数据
$('#resText').empty();//清空resText里面的所有内容
var html= '';//初始化保存内容变量
$.each(data,function(commentIndex,comment){
html+='<div class="comment"><h6>'+comment['username']
+':</h6><p class="para"'+comment['contenet']+'</p><div>'
});
$("#resText").html(html);//显示处理后的数据
}
});
});
});
----------------------------------------------------------------------------------
什么是Ajax?
Ajax是(Asynchronous JavaScript And XML)是异步的JavaScript和xml。也就是异步请求更新技术。Ajax是一种对现有技术的一种新的应用，不是一门新语言。它是用JavaScript编写。与xml的关系就是可以读取和返回xml文件。
Ajax的核心对象就是xmlHttpRequest
XMLHttpRequest用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
----------------------------------------------------------------------------------
Ajax实例(焦点离开验证用户是否存在)
[javascript]
var xmlHttp;//声明xmlHttp对象
//实例化xmlHttpRequest对象
function createXMLHttpRequest() {
//表示当前浏览器不是ie,如ns,firefox
if(window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
} else if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
//input失去焦点事件onblur（），调用这个js方法验证
function validate(field) {
if (trim(field.value).length != 0) {
//创建XMLHttpRequest
createXMLHttpRequest();
//每次请求的url地址不同，利用时间产生不同url地址，可以防止缓冲造成问题
var url = "user_validate.jsp?userId=" + trim(field.value) + "×tamp=" + new Date().getTime();
xmlHttp.open("GET", url, true);
//方法地址，处理完成后自动调用，回调
xmlHttp.onreadystatechange=function() { //匿名函数
if(xmlHttp.readyState == 4) { //Ajax引擎初始化成功
if (xmlHttp.status == 200) { //http协议成功
document.getElementById("userIdSpan").innerHTML = "<font color='red'>" + xmlHttp.responseText + "</font>";
}else {
alert("请求失败，错误码=" + xmlHttp.status);
}
}
};
//将参数发送到Ajax引擎
xmlHttp.send(null);
}else {
document.getElementById("userIdSpan").innerHTML = "";
}
}
[html]
<td width="78%">
<input name="userId" type="text" class="text1" id="userId"
size="10" maxlength="10" onkeypress="userIdOnKeyPress()" value="<%=userId %>" onblur="validate(this)"><span id="userIdSpan"></span>
</td>
[java]//后台验证方法利用jsp编写
<%@ page language="java" contentType="text/html; charset=GB18030"
pageEncoding="GB18030"%>
<%@ page import="com.bjpowernode.drp.sysmgr.manager.*" %>
<%
//可以采用清除缓存的方法，如下
//response.setContentType("text/xml");
//response.setHeader("Cache-Control", "no-store"); //HTTP1.1
//response.setHeader("Pragma", "no-cache"); //HTTP1.0
//response.setDateHeader("Expires", 0);
//out.println("Hello");
//Thread.currentThread().sleep(3000);
String userId = request.getParameter("userId");
if (UserManager.getInstance().findUserById(userId) != null) {
out.println("用户代码已经存在");
}
%
----------------------------------------------------------------------------------
var a = {} 与 var a = function(){} 的区别？(类似于ztree的解析)
var a = {}
此时a是一个***对象***，是一个没有任何属性的对象。
var a = {'name':'object'}
此时a是一个对象，是一个有一个属性的对象，属性名为name，属性的值为object。
alert(a.name) 或者alert(a[name])的结果都是object，这是对象访问属性的两种方式。
var a = function(){}
此时a指向一个函数，相当于有一个函数，名为a，可以这么调用这个函数：
a()
只不过这个函数什么都没有做。
var a = function(){
alert(1);
}
此时a是一个函数，调用a()执行的是函数体，也就是 alert(1)
-----------------------------------------------------------------------------------
对于jsp页面的访问跳转,要做到通过后台进行访问,直接访问是不可行的.
用ajax传值.
-----------------------------------------------------------------------------------
error:
存值与数据库类型对不上报ORA错误
-----------------------------------------------------------------------------------
var data = deviceUseTable.row($(this).parent()).data();
row:
js 中关于table表格的cell，row 的属性的操作
标签： tableurlbuttonfunctioninput
2010-06-04 18:17 3593人阅读 评论(0) 收藏 举报
<html>
<head>
<title>添加行</title>
<script type="text/JavaScript">
function addRow(tb)
{
var tb=document.getElementById(tb);
alert(tb.rows(0).cells(0).innerText);
var tbody = tb.childNodes[0];
//插入行
tbody.insertRow(0);
//插入列
tbody.rows[0].insertCell(0);
tbody.rows[0].cells[0].setAttribute("align","center");
tbody.rows[0].cells[0].setAttribute("colspan","2");
tbody.rows[0].cells[0].appendChild(document.createTextNode("员工表"));
}
</script>
</head>
<body>
<table id="mytab" style="width:100px">
<tr> <td>编号 </td> <td>姓名 </td> </tr>
<tr> <td>1 </td> <td>小王 </td> </tr>
<tr> <td>2 </td> <td>小明 </td> </tr>
<tr> <td>3 </td> <td>小如 </td> </tr>
<tr> <td>4 </td> <td>小陈 </td> </tr>
<tr> <td>5 </td> <td>小赵 </td> </tr>
<tr> <td>6 </td> <td>小刘 </td> </tr>
<tr> <td>7 </td> <td>小王 </td> </tr>
<tr> <td>8 </td> <td>小明 </td> </tr>
<tr> <td>9 </td> <td>小如 </td> </tr>
<tr> <td>10 </td> <td>小陈 </td> </tr>
</table>
<input type="button" name="btnAddRow" onclick="addRow('mytab')" value="添加行"/>
</body>
</html>
来自网路的东东：
第一步, 获得当前的cell,也就是 this.
第二步, this.parentNode也就是tr
遍历tr的cells,获取所有cell的innerText
我所说的都是可行的概念,虽然没有贴出源代码,还是可以琢磨出来的.
获取所有cell的值.
var permTable = document.getElementById('permMatrix');
var cells = permTable.rows(0).cells;
var cellsLength = cells.length;
for(var j=2; j < cellsLength; j++)
{
url+=cells[j].innerText+";";
}
var rowsLength=permTable.rows.length;
for(var i = 1; i < rowsLength; i++)
{
url += "&folder" + i + "=";
var cells = permTable.rows(i).cells;
var cellsLength = cells.length;
for(var j=0; j < cellsLength; j++)
{
url+=cells[j].innerText+";";
}
}
-----------------------------------------------------------------------------------
jQuery->parent:
jquery .parents(), .parent() 和 closest()方法
2014-02-18 11:46 5038人阅读 评论(0) 收藏 举报
分类： jQuery（5）
版权声明：本文为博主原创文章，未经博主允许不得转载。
目录(?)[+]
parent是找当前元素的第一个父节点，parents是找当前元素的所有父节点
parent()、parents()与closest()方法两两之间有类似又有不同，本篇简短的区分一下这三个方法。通过本篇内容，大家将会在以后使用.parent()、parents()和closest()时不会显得无从下手。
我们直接看例子来来说明一下这三个方法的使用区别：
<ul id="menu" style="width:100px;">
<li>
<ul>
<li>
<a href="#">Home</a>
</li>
</ul>
</li>
<li>
End
</li>
</ul>
接下来，分别看看这三个方法：
//点击Home时
$("#menu a").click(function() {
$(this).parent("ul").css("background", "yellow"); //0
$(this).parent("li").parent("ul").css("background", "yellow"); //1
$(this).parents("ul").css("background", "yellow"); //2
$(this).closest("ul").css("background", "yellow"); //3
return false; });
1.parent()方法从指定类型的直接父节点开始查找，在"0"中，<a>的直接父节点是<li>所以在这里找不到<ul>父节点。在"2"中先找到了<li>，接着找到<ul>，并将它的背景色设置为yellow。parent()返回一个节点。
2.parents()方法查找方式同parent()方法类似，不同的一点在于，当它找到第一的父节点时并没有停止查找，而是继续查找，最后返回多个父节点，如在"2"中，使得id为menu的ul整个背景色变成了yellow。
3.closest()方法查找时从包含自身的节点找起，它同parents()很类似，不同点就在于它只返回一个节点如在"3"中，实现的功能同1相同。但它使得代码量减小，同"2"相比又只返回单一的一个节点。可见，closest()方法在项目中的使用频率是比较大的。
但是注意一点:
看jQuery官方的解释:
closest(expr,[context]|object|element)
概述
jQuery 1.3新增。从元素本身开始，逐级向上级元素匹配，并返回最先匹配的元素。。
closest会首先检查当前元素是否匹配，如果匹配则直接返回元素本身。如果不匹配则向上查找父元素，一层一层往上，直到找到匹配选择器的元素。如果什么都没找到则返回一个空的jQuery对象。
closest和parents的主要区别是：1，前者从当前元素开始匹配寻找，后者从父元素开始匹配寻找；2，前者逐级向上查找，直到发现匹配的元素后就停止了，后者一直向上查找直到根元素，然后把这些元素放进一个临时集合中，再用给定的选择器表达式去过滤；3，前者返回0或1个元素，后者可能包含0个，1个，或者多个元素。
closest对于处理事件委托非常有用。
这里parents()方法虽然是将查询到的元素都放在 了一个临时集合中, 但是它并不是按照正常Dom结构放的, 而是按照查询的顺序放到临时容器中的, 相当于是原始文档的倒序放置方式. 注意: 这里倒序的意思是说: 元素的存放位置是倒序的, 例如: :first:, :last 等存放的顺序是倒序的.
因为closest() 函数逐级向上查找，直到发现匹配的元素后就停止了, 因此它不支持 过滤选择器 tr:first 等选择器, 而 parents() 是要从多个元素中选择出来一个适合的, 因此它可以使用过滤选择器.
例如:
$(this).closest("tr").remove();
$(this).parents("tr:first").remove();
-----------------------------------------------------------------------------------
ajax.reload()
重新加载数据
说明
这个方法提供了使用已经定义的url重新请求服务器取回数据给表格显示，如果你需要更改请求路径可以使用 ajax.url()DT
数据类型
functionajax.reload( callback, resetPaging )
参数:
名称 类型 是否可选
1 callback functionJS Yes - default:null
当服务器返回数据并重绘完毕时执行此回调方法，回调方法返回的是服务器返回的数据
2 resetPaging booleanJS Yes - default:true
重置（默认或者设置为true）或者保持分页信息（设置为false）
返回:
DataTables.ApiDT ,
DataTables.Api 实例
示例
每30秒重新加载表数据(分页重置)
1 var table = $('#example').DataTable( {
2 ajax: "data.json"
3 } );
4
5 setInterval( function () {
6 table.ajax.reload();
7 }, 30000 );
每30秒重新加载表数据(分页留存)
var table = $('#example').DataTable( {
ajax: "data.json"
} );
setInterval( function () {
table.ajax.reload( null, false ); // 刷新表格数据，分页信息不会重置
}, 30000 );
使用回调函数来更新外部元素
var table = $('#example').DataTable();
table.ajax.reload( function ( json ) {
//这里的json返回的是服务器的数据
$('#myInput').val( json.lastInput );
} );
-----------------------------------------------------------------------------------