Question

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

enter image description here

这是我的代码：

<!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>

AND JS：

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

Answer 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({...});

Jquery标签 - 它自动完成放置

1 个答案: