Re: [問題] 初學Jquery的幾點問題

看板Ajax作者 (^^)時間16年前 (2009/12/01 23:02), 編輯推噓1(100)
留言1則, 1人參與, 最新討論串2/4 (看更多)
※ 引述《averywu (我是阿Q )》之銘言: : 好吧,我才剛摸這個二天。 : 學著的過程中,有幾點不懂。不知道有沒有人可以指點一下這麼初級 : 的問題。 : <script type="text/javascript" src="jquery-1.3.2.min.js"></script> : <script language = "javascript"> : $("a#open").click(function() { : $("#menu").show(); : return false; : }); : </script> : <style type="text/css"> : #menu {display: none} : </style> : <a id="open" href="#">控制面板</a> : <ul id="menu"> : <li><a href="#1">控制面板首頁</a></li> : <li><a href="#2">編輯個人資料</a></li> : <li><a href="#3">個人空間管理</a></li> : </ul> : 這是我直接從教學網站上拉下來的,可是在我的環境下完全不動作。 : 在對方的站上是有效果的。 : jquery確定有載入。是什麼問題呢?(我的檔就上面幾行,還是要完整的html才能 : 作用?) 時間點不對 , 以一般的狀況下是先讀到先執行 , 除非放 ready 那又是另一回事. 簡單來說 執行$("a#open") 的時候 , 你的dom 根本就還沒有open這個元素 , 你把script tag 拉到ul下面應該就會有效果了. (不過一般來說基本的頁面還是盡量擁有完整得結構比較好.) : $("form").submit(function() { : if ($("input#username").val() == "") : $("span.help").show(); : }); : 這段裡,submit(後有加function() : $("#body").css({ : border: "1px solid green", : height: "40px" : }); : 這段裡,css後面沒加function() : $("a[target]").append(" (Opens in New Window)"); : 這段裡不止沒加function,連大括號都不見了。 : 大括號及function()適用時機為何呢? : 問的很膚淺,請見諒。 你要先瞭解 {} 跟 function(){} 所代表的意義 , 前者是一種物件 , 如果你有學過其它語言或者是資料結構 , 他的角色有點像 map . var k={atr1:'hi', atr2:'hi2'}; alert(k.atr1); // 'hi' alert(k.atr2); // 'hi2' k.atr1="hello"; alert(k.atr1); // 'hello' 至於 function (){} 這東西比較抽象 , 他是個匿名函式 , 在 js 裡面是可以把 function 當成一種物件的 , 也就是說可以有類似這樣的事情發生 ---------------------------------------------------------- function ok(){ alert('hi');} function ok_2(fn){ fn(); //執行fn } ok_2(ok); ---------------------------------------------------------- 把ok丟進ok_2當param , 結果 ok_2 執行了 ok , 得到了 'hi' 在這裡 ok跟 ok_2 都是一個具名函式 . 也可以寫成 var ok =function(){ alert('hi'); }; 這段話代表的意義是 將 function(){alert('hi);}這個匿名函式指定給 ok 這個變數名稱. ---------------------------------------------------------- 回到原本的主題 , click(fn) 是說當我按下這個物件時 , 觸發click這個事件後 , 去執行我們所設定的函數 (fn ), 所以這邊我們通常會直接寫一個匿名函式 , 如果你不嫌麻煩 要寫成 var hello=function(){ alert("hi"); } jqXXX.click(hello); 或者是 function hello(){ alert("hi"); } jqXXX.click(hello); 這都是ok的 都等同於 jqXXX.click(function{alert('hi');}); 至於 css , 他能接受的有兩種形式. 一個是 xxx.css("styleName","value"); 另一個是 xxx.css({styleName1:'value1',styleName2:'value2'}); 前者就跟寫css很像 , 一行一個屬性沒啥好說的. 如果是後者 , 他會去遍歷這個 object 中的所有屬性(attribute ) , 用這些屬性來做設定 . 同樣的 , var obj={styleName1:'value1',styleName2:'value2'}; xxx.css(obj); 這樣寫的意思也是一樣的.. {} or function(){} 有結構上的不同, 但是你的問題都不是在這兩者 , 而是你沒有弄懂 css / click 這兩個函數的差別 , 還有他們所需要的參數(parameter) . 因為他們需要接受的參數本來就不一樣 , 所以你當然很難找出一個規則. 建議你可以先試著看看 jQuery的doc . -- I am a person, and I am always thinking . Thinking in love , Thinking in life , Thinking in why , Thinking in worth. I can't believe any of what , I am just thinking then thinking , but worst of all , most of mine is thinking not actioning... -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 61.224.105.141

12/01 23:14, , 1F
太詳細了,感謝賜教!
12/01 23:14, 1F
文章代碼(AID): #1B5I_evI (Ajax)
文章代碼(AID): #1B5I_evI (Ajax)