問題：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