Jquery方法

1.Jquery排他 not(this)

以前在工作中碰到排他的情況都是對所有對象執行反操作，然後再對特定的對象進行正操作，如下：

$('.catalogue').on('click','.title',function(){
	   $(this).toggleClass('active')
	   $(this).next().toggle()
	   $('.catalogue .title').not(this).removeClass('active');
	   $('.catalogue .title').not(this).next().hide();
})

這個時候就需要用到Jquery的一個方法——not(this)，就可以輕鬆實現排他

2.Jquery排他模塊化佈局 load(DOM)

load() 方法從服務器加載數據，並把返回的數據放置到指定的元素中。引入html 標籤，如下：

1.dom.html 完全是hmtl標籤

<div>
	<h1 class="center">模塊化</h1>
	<ul class="theme-bgBlue fz12">
		<li class="theme-black666">模塊化佈局屬性</li>
		<li class="theme-black666">模塊化佈局屬性</li>
		<li class="theme-black666">模塊化佈局屬性</li>
	</ul>
</div>

2.html

<div class="box J_dataload"></div>
<div class="box J_dataloads"></div>

3.js

$(function(){
	$('.J_dataload').load('loads.html',function () {//可以引入簡單html 不建議引用
		//....
        $.getScript("loads.js");//引入js
	});	
	$('.J_dataloads').load('dom.html',function () {//引入標籤
		//....
	});	
})

3.jq實現點擊空白處，指定元素消失，且指定元素內部事件不受影響

第一步首先 先給body事件

$("body").click(function(){
    $(".emoji-container").hide();
});

第二步元素本身阻止事件冒泡

$(".emoji-container").click(function(e){
    e.stopPropagation();//阻止冒泡到body
});

或者其他影響附件，發現冒泡事件將bootstrap的tab事件抑制了

$('#emojiTab a').click(function (e) {
    e.preventDefault();
    $(this).tab('show')
});