自动完成jQuery.noConflict

时间:2016-10-09 11:01:21

标签: javascript jquery autocomplete

我想在已经使用捆绑版jQuery的现有页面中添加新的自动完成输入。因此,我需要使用jQuery.noConflict()

在此页面之外,我的代码工作正常,但在现有页面上,我不知道如何让它工作。

我总是收到错误$ (...).autocomplete is not a function

这里是我使用的代码:

// .....code from existing page with already loaded jQuery script 

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">

$.noConflict();
jQuery( document ).ready(function( $ ) {
    /* Make the AJAX request once for the source array: */
    $.getJSON("./mapdata/get_list_json.php", function (data) {
        $("#parzelle").autocomplete({
            minLength: 3,`enter code here`
            source: data,
            dataType: "json",
            select: function(event, ui) {
        // prevent autocomplete from updating the textbox
        event.preventDefault();
        // manually update the textbox and hidden field
        $(this).val(ui.item.label);
        $("#gid").val(ui.item.value);
        }
        });
    });   
});  

1 个答案:

答案 0 :(得分:0)

很抱歉,但我也对代码进行了一些改动。 所以这就是我如何让它发挥作用:

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">

// .....code from existing page with already loaded jQuery script 

$J = jQuery.noConflict();
$J( document ).ready(function( $J ) {
//$(function () {
    /* Make the AJAX request once for the source array: */
    $J.getJSON("./mapdata/get_parzellen_list_json.php", function (data) {
        $J("#parzelle").autocomplete({
            minLength: 3,
            source: data,
            dataType: "json",
            select: function(event, ui) {
        // prevent autocomplete from updating the textbox
        event.preventDefault();
        // manually update the textbox and hidden field
        $J(this).val(ui.item.label);
        $J("#gid").val(ui.item.value);
        }
        });
    });   
});