作者lastoct (lastoct)
看板Web_Design
標題Re: [問題] CSS中的JavaScript
時間Sat Apr 7 00:57:47 2007
※ 引述《StarTouching (撫星)》之銘言：
: 大家都知道JavaScript可以控制CSS(obj.style),
: 可是我有個問題, CSS能不能控制JavaScript的事件處理器?
: 例如所有<button>標籤都要有 onClick="myFunc(this);"
: 有沒有辦法用css做到? 就像用css設定一般的標籤屬性一樣?
: ---
: 我的幻想:
: button{
: event:onclick('myFunc(this)');
: }
: 或者
: button{
: event.onclick:myFunc(this);
: event.ondbclick:none;
: }
推薦一個library還不錯,jQuery
http://jquery.com/
雖然名氣沒有Prototype大,不過發展的質量非常的好
使用就是如一般Lib的載入就可以，應該也有些中文資料可以參考
上述的需求範例:
<input type="button" class="fun1" value="按鈕1"/>
<input type="button" calss="fun1" value="按鈕2"/>
<script>
jQuery("input.fun1").click(function(){myFunc(this)});
</script>
這邊是API參考
http://jquery.bassistance.de/api-browser/#cssString
幾個特色:
1.支援XPath與CSS-Selector
jQuery("input.fun1") - 找出input中類別為fun1
jQuery(".fun1") - 找出DOM中所有類別為fun1的元素
jQuery("div:hiden")
jQuery("p:first")
jQuery("#foo:first-child") - 找出ID為Foo的第一個子元素
<div id="foo"><span>child element</span></div> - 回傳<span>...</span>
2.支援chian
jQuery(".fun1").click(function(){alert('clickme');})
.mouseover(function(){jQuery(this).css({color: "red"})})
.addClass("fun2");
3.實作Ajax引擎
4.有一些簡單的effect,例如hide/show/fadeIn/toggle
5.有許多使用者貢獻實用的Plugin
可能有點離題,也有些複雜; 不過對如果常寫Javascript的人可以參考參考
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 211.72.111.115