Re: [問題] jquery子元素繼承問題
※ 引述《etman395 (技術時代)》之銘言：
: 我在試一個menu
: 點擊ul li才會出現
: 再點擊同一個ul 那個ul 的li就會隱藏
: 或者點擊別的ul 另一個己經展開的ul裡的li就會隱藏
: 但我發現一個問題
: 就是我點擊ul 裡的li li一樣會繼承ul的click事件
: 請問怎麼讓子元素不繼承父元素的事件?
: jquery 程式如下
: $(function(){
: $("ul li").hide();
: var c =function(){
: $(this).children().toggle().end().siblings().children().hide();
: }
: $("ul").bind("click",c)
: })
: </script>
剛好在看jQuery的入門書
這本說得比較詳細，有說到防止事件傳遞給後代元素的方法
第一種:
使用event物件來檢查
例:
$('#btn').bind("click",function(event){
if (event.target == this) {
....(你要做的事)....
}
});
就是在function宣告時多加一個event物件
它的target屬性就表示著現在觸發事件的對像
檢查它就能確保發生的對像是你要的
第二種:
使用另外一個event的內建函式來阻擋事件繼續傳播
例:
$('#btn').bind("click",function(event){
....(你要做的事)....
...
event.stopPropagation();
});
這就是呼叫event物件的函式，命令其停止事件繼續送到別的元素上
jQuery有去解決跨瀏覽器的相容
所以這應該可行
不過要注意這無法停止預設行為
像是在表單上按enter預設會submit出去這個行為
光靠這樣不夠
還得加上同樣是event物件的.preventDefault()方法
或是直接使用第三種方法
第三種:
直接return false
這就直接把
return false;
這行指令加在function內的最後一行就行了
這就不用範例了吧XD
--
這本書比之前青蛙那本要詳細多了...
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 118.160.160.25
推
12/06 03:43, , 1F
12/06 03:43, 1F
討論串 (同標題文章)