jquery 点滴
jQuery——動態給表格添加序號
$(function(){//$('table tr:not(:first)').remove();var len = $('table tr').length;for(var i = 1;i<len;i++){$('table tr:eq('+i+') td:first').text(i);}});原始代碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="http://common.cnblogs.com/script/jquery.js"type="text/javascript"></script> <title>jQuery</title> </head> <body><table width=500 border=2><tr><td width=250>序號</td><td width=250>項目</td></tr><tr><td></td><td>Port</td></tr><tr><td></td><td>Port</td></tr><tr><td></td><td>Port</td></tr><tr><td></td><td>Port</td></tr><tr><td></td><td>Port</td></tr><tr><td></td><td>Port</td></tr><tr><td></td><td>Port</td></tr><tr><td></td><td>Port</td></tr></table> </body> </html>?
變成
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="http://common.cnblogs.com/script/jquery.js"type="text/javascript"></script> <title>jQuery</title> </head> <body><table width=500 border=2><tr><td width=250>序號</td><td width=250>項目</td></tr><tr><td>1</td><td>Port</td></tr><tr><td>2</td><td>Port</td></tr><tr><td>3</td><td>Port</td></tr><tr><td>4</td><td>Port</td></tr><tr><td>5</td><td>Port</td></tr><tr><td>6</td><td>Port</td></tr><tr><td>7</td><td>Port</td></tr><tr><td>8</td><td>Port</td></tr></table> </body> </html>?
Jquery工作常用實例--ajaxStart與ajaxStop(ajaxComplete)
("#loading").ajaxStart(function(){ $(this).show(); //callback })：當一個當Ajax請求開始時將把id為"loading"的內容顯示； ("#loading").ajaxStop(function(){ $(this).hide(); //call })：當一個當Ajax請求結束時將把id為"loading"的內容隱藏；?
<script>$(document).ready(function(){$("#loading").ajaxStart(function(){$(this).show();}).ajaxStop(function(){//ajaxStop改為ajaxComplete也是一樣的$(this).hide();});$("#o").click(function(){$.post("for.php?id=o",function(data){$("#content").html(data);});})$("#p").click(function(){$.post("for.php?id=p",function(data){$("#content").html(data);});})$("#q").click(function(){$.post("for.php?id=q",function(data){$("#content").html(data);});})}) </script>?
jQuery判斷展示的元素，并獲取顯示元素數據
// 獲取顯示元素的數據jQuery(this).find("a:visible").attr("href");// 多級標簽選擇器jQuery("#slider").click(function(){ var rel = jQuery(".nivo-controlNav a.active").attr("rel"); location.href = jQuery(this).find("a").eq(rel).attr("href"); });// 判斷元素是否顯示$(document).ready(function(){ if($("#mydiv").is(":visible")==false){ alert("Hidden"); }else{ alert("Display"); } });
?
如何判斷jquery選擇器選擇結果為空
$("#id").length 這樣就可以通過這樣判斷是否存在符合選擇器條件的內容存在了?
Jquery判斷當前點擊在表格的第幾行第幾列??
$(document).ready(function(){ $(".mytable td").click(function(){ var tdSeq = $(this).parent().find("td").index($(this)[0]); var trSeq = $(this).parent().parent().find("tr").index($(this).parent()[0]); alert("第" + (trSeq + 1) + "行，第" + (tdSeq + 1) + "列"); }); })jquery table 增加兩行,刪除兩行,并且有跨行rowspan
?
//先刪除當前行的下面的一行 $(obj.parentNode.parentNode).next().remove(); //然后再刪除當前行 $(obj.parentNode.parentNode).remove();?
區間代碼?獲取序號2-5之間的數
<ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> </ul>$("li:lt(5)").filter(":gt(2)").prependTo('ul'); $("li:lt(5):gt(2)").prependTo('ul');?
jQuery 獲取當前節點的html包含當前節點的方法
<div class="test"><p>hello，你好！</p></div> <script> $(".test").prop("outerHTML"); </script> 輸出結果為：<div class="test"><P>hello,你好！</p></div>jQuery 追加元素的方法
append() 方法在被選元素的結尾插入內容。 prepend() 方法在被選元素的開頭插入內容。 after() 方法在被選元素之后插入內容。 before() 方法在被選元素之前插入內容。?
jquery版本之間的沖突
<!-- 引入1.6.4版的jq --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script> <script> var jq164 = jQuery.noConflict(true); </script> <!-- 引入1.4.2版的jq --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script> <script> var jq142 = jQuery.noConflict(true); </script><script> (function($){//此時的$是jQuery-1.6.4$('#header'); })(jq164); </script><script> (function($){//此時的$是jQuery-1.4.2$('#footer'); })(jq142); </script>?
?table
獲取table最后一行 $("#tab tr:last") 獲取table第一行 $("#tab tr").eq(0) 獲取table倒數第二行 $("#tab tr").eq(-2) 獲取table總行數 $("#tab").find("tr").length
?
jquery 屏蔽一個區域內的所有元素，禁止輸入
<script type="text/javascript"> (function($) { $.fn.disable = function() { return $(this).find("*").each(function() { $(this).attr("disabled", "disabled"); }); } $.fn.enable = function() { return $(this).find("*").each(function() { $(this).removeAttr("disabled"); }); } })(jQuery); </script> <script type="text/javascript"> $(document).ready(function() { $("#div_test").disable(); }); </script>
除了某個元素 not
$(".r_options_title").click(function(){$(this).parents("li").enable();$(".r_options_title").not(this).parents("li").disable();});?
轉載于:https://www.cnblogs.com/wangxusummer/p/4345699.html
總結
- 上一篇： 在MyEclipse中添加 XML Ca
- 下一篇： 个人资源收集备忘录