問題：autocomplete提示框被遮擋
最近在使用jQuery 插件fullCalendar做一個會議預約功能，建立預約時用到了jQuery UI的兩個插件dialog和autocomplete,結果遇到了下圖所示問題:autocomplete的傳回item被dialog遮擋啦。
由于對css不太熟悉，摸索了良久未能解決，到處搜尋未找到方案，最後請教了前端大牛，輕松搞定，不得不服，其間又學到了一些新技能，故稍作總結，希望能幫到和我一樣遇到此問題的前端小白們。
首先介紹一個CSS屬性：
z-index 屬性設定元素的堆疊順序。擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面。
也就是z-index屬性值越大的元素會顯示越上面
詳細了解z-index屬性，請參考W3School：
http://www.w3school.com.cn/cssref/pr_pos_z-index.asp
網友部落格：http://www.uzzf.com/news/8287.html
解決方法：設定z-index屬性
在autocomplete item上點選右鍵，點選彈出菜單中“審查元素”，出現如下視圖：
可以看到 autocomplete 元素的z-index 是100
dialog的z-index值也是100，因為他們都引用了 ui-front類，而由于相同級别的z-index 顯示順序與文檔流順序有關，故下面的dialog元素 覆寫了上面的autocomplete 元素
找到了問題原因，解決方法自然就簡單了，隻需把autocomplete元素的z-index值設定大一些就行了。通過檢視元素屬性，我們發現autocomplete元素還具有ui-autocomplete這個類屬性，于是我單獨為這個類添加了z-index屬性，如下：
<style>
.ui-autocomplete{
z-index: 11111;
}
</style>
如此，autocomplete元素自動使用了這個z-index更大的值。效果如下:
原文出處：http://blog.csdn.net/rchm8519/article/details/42924927