0

我正在尝试使用 aehlke/tag-it 及其自动完成选项。自动完成显示，但在一个奇怪的位置。

在此处输入图像描述

这是我的代码：

<!doctype html>
<html lang='en'>
    <head>
        <meta charset='utf-8'/>
        <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/flick/jquery-ui.css">
        <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
        <link href="tag-it/css/jquery.tagit.css" rel="stylesheet" type="text/css">
        <link rel='stylesheet' type='text/css' href='bootstrap/css/bootstrap.css'>
        <link rel='stylesheet' type='text/css' href='style.css'>
    </head>
    <body>



        <div class='container'>
            <h2> Tagging Functions </h2>
            <div class='row'>
                <div class='span5'>
                    <ul id="myTags">
                        <!-- Existing list items will be pre-added to the tags -->

                    </ul>
                </div>
            </div>
        </div>




        <!-- Scripts -->
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="tag-it/js/tag-it.js" type="text/javascript" charset="utf-8"></script>
        <script scr='bootstrap/js/bootstrap.js'></script>
        <script src='js/main.js'></script>
    </body>
</html>

和 JS：

// Main JS
$(document).ready(function() {
  $("#myTags").tagit({
    availableTags:['me', 'you']
  });
});
4

1 回答 1

1

这是因为 tag-it 使用 curCSS 已在 1.8 上从 jQuery 中删除，所以如果您使用任何 jQuery 版本高于此... 将无法正常工作。

一种解决方法可能是加载 jQuery 1.7.x 并使用jQuery.noConflict

这是我的解决方案

//Save current jQuery
current_jquery = $.noConflict(true);

//Load the jQuery 1.7.3
current_jquery('<script>').appendTo($('head')).attr({
    type: 'text/javascript',
    id  : 'jquery_173',
    src : '//ajax.googleapis.com/ajax/libs/jquery/1.7.3/jquery.min.js'
});

//Keep jQuery 1.7.3 in a var to use it later
jquery_tagit = $.noConflict(true);

//Revert the jQuery that you where using to its original var $
$ = jQuery_actual;

//Load tag-it with jQuery 1.7.3
jquery_tagit.tagit({...});
于 2014-01-07T17:03:37.427 回答