2

我在 jquery fancybox 中包含一个自动完成 jquery 文本框时遇到问题。如果自动完成文本框不在幻想框中,它似乎可以正常工作,但是一旦我在幻想框中使用它,它就根本不起作用......就像你不能在 jquery 中使用 jquery 一样?

代码如下(jquery文件的链接已经做了):

<script type="text/javascript" src="site/themes/ama/js/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="site/themes/ama/fancyBox/jquery.fancybox.js"></script>
<link rel="stylesheet" href="site/themes/ama/fancyBox/jquery.fancybox.css" type="text/css" media="screen" />


<script>
var availableTags = ["one","two","three"];
$(document).ready(function(){
$( "#tags" ).autocomplete({
   source: availableTags
  });
  $(".fancybox").fancybox();
});
</script>

花式框 div 如下

<div id="display" style="display:none;">
<form name="upload" action="" method="post" enctype="multipart/form-data">
<label for="tags">Tags: </label>

这是不作为自动完成文本框工作的文本框。

<input type="text" id="tags" name="gallery" style="height: 20px;">
</form>
</div>

<p style="clear:both;"><a href="#display" class="fancybox">Upload Images</a></p>

感谢您的帮助!

更新 我尝试过使用 noConflict 但已经意识到它仅适用于 jquery 框架和其他框架之间的冲突,而不是为 jquery 制作的插件。我对这个问题感到非常困惑......

4

1 回答 1

2

在你的 CSS 中使用它,这将解决问题:

.ui-autocomplete {
    z-index: 99999;
}
于 2014-01-16T14:16:32.470 回答