-
.html() 獲得第一個元素的html內容；.test() 獲得所有元素的內容；.val()獲得第一個元素的當前值查看全部
-
右鍵菜單插件可以綁定頁面中的任意元素，綁定后，選中元素，點擊右鍵，便通過該插件彈出一個快捷菜單，點擊菜單各項名稱執行相應操作，調用代碼如下： $(selector).contextMenu(menuId,{options}); Selector參數為綁定插件的元素，meunId為快捷菜單元素，options為配置對象。查看全部
-
搜索插件的功能是通過插件的autocomplete()方法與文本框相綁定，當文本框輸入字符時，綁定后的插件將返回與字符相近的字符串提示選擇，調用格式如下： $(textbox).autocomplete(urlData,[options]); 其中，textbox參數為文本框元素名稱，urlData為插件返回的相近字符串數據，可選項參數options為調用插件方法時的配置對象。查看全部
-
$("form *")=arrt("diabled","true")查看全部
-
attr()方法是設置或者獲取元素的某項屬性值查看全部
-
jQuery UI $("#x").draggable({containment: "parent","axis":"x"}); 拖動查看全部
-
1,delay()方法延時執行動畫效果，它的調用格式為： $(selector).delay(duration) 其中參數duration為延時值，單位是毫秒，當超過延時值時，動畫繼續執行。 2，delay()方法延時正在執行的動畫效果 $(function () { $("span").animate({ left: "+=100px" }, 3000, function () { $(this).animate({ height: '+=60px', width: '+=60px' }, 3000, function () { $("#tip").html("執行完成!"); }); }); $("#btnStop").bind("click", function () { $("span").delay(3000); $("#tip").html("正在延時!"); }); });查看全部
-
1,stop()方法的功能是在動畫完成之前，停止當前正在執行的動畫效果，這些效果包括滑動，淡入淡出和自定義的動畫，它的調用格式為： $(selector).stop([clearQueue],[goToEnd]) 其中，兩個可選項參數都是布爾類型值，前者表示是否停止正在執行的動畫，后者表示是否完成正在執行的動畫，默認為false 2,停止正在運動的span $(function () { $("span").animate({ left: "+=100px" }, 3000, function () { $(this).animate({ height: '+=60px', width: '+=60px' }, 3000, function () { $("#tip").html("執行完成!"); }); }); $("#btnStop").bind("click", function () { $("span").stop(); $("#tip").html("執行停止!"); }); });查看全部
-
1,調用animate()方法不僅可以制作簡單漸漸變大的動畫效果，而且還能制作移動位置的動畫，在移動位置前，必須將元素的position設置好，否則元素移動不了。 2，移動并且變大的span $(function () { $("span").animate({ left: "+=100px" }, 3000, function () { $(this).animate({ height: '+=30px', width: '+=30px' }, 3000, function () { $("#tip").html("執行完成!"); }); }); });查看全部
-
1,調用animate()方法可以創建自定義的動畫效果，它的調用格式為： $(selector).animate({params},speed,[callback]) 其中，params參數為制作動畫效果的css屬性名和值 2，制作一個漸漸放大的正方體 <h3>制作簡單的動畫效果</h3> <span></span> <div id="tip"></div> <script type="text/javascript"> $(function () { $("span").animate({ width: "80px", height: "80px" }, 3000, function () { $("#tip").html("執行完成!"); }); });查看全部
-
1，fadeTo()方法，可以將所選擇元素的不透明度以淡入淡出的效果調整為指定的值，該方法的格式為： $(selector).fadeTo(speed,opacity,[callback]) 2,試著給三個淡入的盒子以不同透明度淡入 $(function () { $("span").each(function (index) { switch (index) { case 0: $(this).fadeTo(3000,0.2); break; case 1: $(this).fadeTo(3000,0.4); break; case 2: $(this).fadeTo(3000,0.6); break; } }); });查看全部
-
1,fadeIn()和fadeOut()方法可以實現元素的淡入淡出效果，前者為淡入隱藏的元素，后者可以淡出可見的元素，調用格式： $(selector).fadeIn(speed,[callback]) $(selector).fadeOut(speed,[callback]) 2，圖片的淡入淡出 var $div1 = $("#divtest1"); var $div2 = $("#divtest2"); $div1.bind("click",function(){ $div1.fadeOut(3000,function(){ $div2.fadeIn(3000); }); }) $div2.bind("click",function(){ $div2.fadeOut(3000,function(){ $div1.fadeIn(3000); }); }) 3,下拉條的淡入淡出 $(function () { $("h4").bind("click", function () { if ($("#hidval").val() == 0) { $("ul").fadeIn("fast",function() { $("#hidval").val(1); }) } else { $("ul").fadeOut("fast",function() { $("#hidval").val(0); }) } }) });查看全部
-
1，使用slideToggle(),方法可以切換slideUp()和slideDown()，格式為： $(selector).slideToggle(speed,[callback]) 2，在頁面中，使用該方法實現圖片的變臉效果 var $div1 = $("#divtest1"); var $div2 = $("#divtest2"); $div1.bind("click",function(){ $div1.slideToggle(3000,function(){ $div2.slideToggle(3000) }); }) $div2.bind("click",function(){ $div2.slideToggle(3000,function(){ $div1.slideToggle(3000); }); }) 4,字條切換 $(function () { var $spn = $("#spnTip"); $("h4").bind("click", function () { $("ul").slideToggle("fast",function() { $spn.html() == "向下滑" ? $spn.html("向上滑") : $spn.html("向下滑"); }) })查看全部
-
菜單工具插件可以通過<ul>創建多級內聯或彈出式菜單，支持通過鍵盤方向鍵控制菜單滑動，允許為菜單的各個選項添加圖標，調用格式如下： $(selector).menu({options}); selector參數為菜單列表中最外層<ul>元素，options為menu()方法的配置對象。查看全部
-
對話框插件可以用動畫的效果彈出多種類型的對話框，實現JavaScript代碼中alert()和confirm()函數的功能，它的調用格式為： $(selector).dialog({options}); selector參數為顯示彈出對話框的元素，通常為<div>，options參數為方法的配置對象，在對象中可以設置對話框類型、“確定”、“取消”按鈕執行的代碼等。查看全部
-
1，使用slideUp()和slideDown()方法在頁面中滑動元素，前者是用于向上滑動元素，后者用于向下滑動元素，他們的調用方法分別為： $(selector).slideUp(speed,[callback])和$(selector).slideDown(speed,[callback]) 2,要注意的是：slideDown()僅適用于被隱藏的元素，slideUp()則相反 3，例如，調用這兩個方法實現頁面元素的向上和向下的滑動效果 var $div=$("#divtest"); $("#btnAct").bind("click",function(){ var $this=$(this); if($this.val()=="向上滑"){ $div.slideUp(3000,function(){ $this.val("向下滑"); }); }else{ $div.slideDown(3000,function(){ $this.val("向上滑"); }) } }) }) 4，滑動和淡入淡出的區別，滑動改變元素的高度，淡入淡出改變元素的透明度 5，內容的伸縮條案例 $(function () { $("h4").bind("click", function () { if ($("#hidval").val() == 0) { $("ul").slideUp("slow",function() { $("#hidval").val(1); }) } else { $("ul").slideDown("fast",function(){ $("#hidval").val(0); })查看全部
-
選項卡插件——tabs 使用選項卡插件可以將<ul>中的<li>選項定義為選項標題，在標題中，再使用<a>元素的“href”屬性設置選項標題對應的內容，它的調用格式如下： $(selector).tabs({options}); selector參數為選項卡整體外圍元素，該元素包含選項卡標題與內容，options參數為tabs()方法的配置對象，通過該對象還能以ajax方式加載選項卡的內容。查看全部
-
1，調用toggle()方法處于顯示狀態就隱藏，處于隱藏狀態就顯示，比hide(),show()更方便 格式是：$(selector).toggle(speed,[callback]) 2,例子，調用toggle()方法以動畫的效果顯示和隱藏圖片 $("#btnAct").bind("click",function(){ var $this=$(this); $("img").toggle(3000,function(){ $this.val()=='隱藏'?$this.val('顯示'):$this.val('隱藏'); }) }) 3,用toggle()方法實現內容部分的隱藏和顯示 $(function () { var $spn = $("#spnTip"); $("h4").bind("click", function () { $("ul").toggle("fast",function(){ $spn.html() == "隱藏" ? $spn.html("顯示") : $spn.html("隱藏"); }) }); });查看全部
-
除使用draggable插件拖曳任意元素外，還可以調用droppable UI插件將拖曳后的任意元素放置在指定區域中，類似購物車效果，調用格式如下： $(selector).droppable({options}) selector參數為接收拖曳元素，options為方法的配置對象，在對象中，drop函數表示當被接收的拖曳元素完全進入接收元素的容器時，觸發該函數的調用。查看全部
-
1,如果給show()和hide()設置時間和回調函數，它可以實現一些動畫效果，執行完之后會執行函數。 2，例如，以動畫效果方式顯示或隱藏頁面中的圖片，同時，當顯示或隱藏完成時，對應的按鈕狀態將變為不可用。 $(function(){ $("#btnShow").bind("click",function(){ $("img").show(3000,function(){ $("#btnShow").attr("disabled",true); $("#btnHide").attr("disabled",false); }); }); $("#btnHide").bind("click",function(){ $("img").hide("slow",function(){ $("#btnShow").attr("disabled",false); $("#btnHide").attr("disabled",true); }) }) }) 3,以動畫的效果顯示或隱藏正文元素，并在回調方法中，設置控制顯示影藏狀態的hidval元素值 $(function () { $("h4").bind("click", function () { if ($("#hidval").val() == 0) { $("ul").show("slow",function(){ $("#hidval").val(1); }) } else { $("ul").show("fast",function(){ $("#hidval").val(0); }) }查看全部
-
拖曳插件draggable的功能是拖動被綁定的元素，當這個jQuery UI插件與元素綁定后，可以通過調用draggable()方法，實現各種拖曳元素的效果，調用格式如下： $(selector). draggable({options}) options參數為方法調用時的配置對象，根據該對象可以設置各種拖曳效果，如“containment”屬性指定拖曳區域，“axis”屬性設置拖曳時的坐標方向。查看全部
-
1，與bind()方法相同，live()方法與可以綁定元素的可執行事件，除此相同功能外，live()方法還可以綁定動態元素，即使用代碼添加的元素事件，格式如下： $(selector).live(event,[data],fun) 2，例如：使用live()方法綁定，頁面中按鈕元素的單擊事件，而這個按鈕時通過追加的方式添加至頁面的。 $(function(){ $(#btntest).live("click",function(){ $(this).attr("disabled","true"); }) $("body",append("<input id='button' value='點擊就不可用了'/>")) 3,注意，從jq1.7開始，不再建議使用.live()方法，1.9不支持live(). 4,點擊或移除就不可用了。動態添加的按鈕 $(function () { $("#btntest").live("click mouseout", function () { $(this).attr("disabled", "true"); }) $("body").append("<input id='btntest' type='button' value='點擊或移出就不可用了' />"); }); })查看全部
-
1,下拉列表的change事件，當一個元素的值發生變化時，將會觸發change事件，例如在選擇下來列表框中的選項時，就會觸發change事件。<br> 2，示例：當頁面選擇下拉列表框中的選項時，將在<div>元素中顯示所選擇的選項內容<br> $(function(){<br> $("select").bind("change",function(){<br> $("div").html("你選擇的是:"+$(this).val())<br> })<br> 3,根據不同選項改變下拉框的背景色。<br> $(function () {<br> $("select").bind("change", function () {<br> if ($(this).val() == "蘋果")<br> $(this).css("background-color", "red");<br> else<br> $(this).css("background-color", "green");<br> })<br> });<br> <br> }) 該事件僅適用于文本域（text field），以及 textarea 和 select 元素。 change() 函數觸發 change 事件，或規定當發生 change 事件時運行的函數。 注釋：當用于 select 元素時，change 事件會在選擇某個選項時發生。當用于 text field 或 text area 時，該事件會在元素失去焦點時查看全部
-
$. param 工具函數，能使對象或數組按照key/value格式進行序列化編碼，該編碼后的值常用于向服務端發送URL請求，調用格式為： $. param (obj); 參數obj表示需要進行序列化的對象，該對象也可以是一個數組，整個函數返回一個經過序列化編碼后的字符串。 param和serialize的區別是什么？前者是對任意的參數進行URL地址格式的轉換，而后者僅屬于form提交的數據轉換。查看全部
-
1，focus事件在元素獲取焦點時觸發，如點擊文本框時，觸發該事件，而blur事件則在元素丟失焦點時觸發，如點擊除文本框的任何元素，都會觸發該事件。 例如：在觸發文本框的focus事件是，div元素顯示提示內容 $(function(){ $("input").bind("focus",function(){ $("div").html("請輸入您的姓名！"); }) }) 3,非空驗證示例 $(function(){ $(input).bind("focus",function(){ $("div").html("請輸入您的姓名"); }).bind("blur",function(){ if($(this).val().length==0) $("div").html("您的名稱不能為空！"); }) })查看全部
舉報
0/150
提交
取消