如何将jquery-1.10.2.js和jQuery-2.1.4.min.js包含在一起

Hello I am including jQuery-2.1.4.min.js and jquery-1.10.2.js together but I am getting error:

custom.js:375 Uncaught TypeError: $(...).autocomplete is not a function

If i remove jQuery-2.1.4.min.js then i m getting error in one price ranger. So i can not remove any one JS.

So how to use both so that my price ranger and autocomplete functionality works ?

Script:

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript" src="mydirectorypath/js/jQuery-2.1.4.min.js"></script>

By Above code I am getting error $(...).autocomplete is not a function

It is possible to use two jQuery in the same page. Like below

<!-- load jQuery 2.1.4 -->
<script type="text/javascript" src="mydirectorypath/js/jQuery-2.1.4.min.js"></script>
<script type="text/javascript">
var jQuery_2_1_4 = $.noConflict(true);
</script>

Now you can use jQuery_2_1_4 than the $

<!-- load jQuery 1.10.2 -->
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
var jQuery_1_10_2 = $.noConflict(true);
</script>

Now you can use jQuery_1_10_2 than the $

In order to use jQuery and jQuery UI you will need three things in this sequence:

  1. The jQuery UI CSS, along with any customization/theme
  2. jQuery library; usually minimized for space
  3. The jQuery UI code library, also minimized.

For simplicity, here is an example of all three, in a CDN:

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

This is the normal sequence that they are included, usually in your <head> tag so that if it is used within (later) head inclusions, it works.

Given all that, here is the code and sequence that would work if I used the sample from the Autocomplete page here: https://jqueryui.com/autocomplete/

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script>
  $(function() {
    var availableTags = [
      "ActionScript","AppleScript","Asp","BASIC","C","C++","Clojure",
      "COBOL","ColdFusion","Erlang","Fortran","Groovy","Haskell","Java",
      "JavaScript","Lisp","Perl","PHP","Python","Ruby","Scala","Scheme"
    ];
    $( "#myinput" ).autocomplete({
      source: availableTags
    });
  });
  </script>

Then, in the body my input tag:

<input id="myinput" type="text"/>

Unless you need to support older browsers, then you ONLY need the 2.X version (2.2.2 demonstrated here) If you DO need to support older browsers, you should only need the 1.X version. To show it working I created this: https://jsfiddle.net/MarkSchultheiss/op7Lq06g/

EDIT:

What about that missing HTTPS in your question: To match your site, you exclude that from the linked tags, and it automatically per the HTML specification puts that in to match the page source from your site. Example:

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

For a detailed explanation including a link to the specification for that see this question: https://stackoverflow.com/a/36638189/125981