Uncaught TypeError: e.indexOf is not a function while upgrading JQuery version
I got an error while upgrading jQuery
version from 2.2.4 to 3.6.3 and Bootstrap
from 3.3.6 to 3.3.7.
HTML CODE:
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
{% block head %}
{% block meta %}
<link rel="icon" href="{% static '/images/logo.jpg' %}">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- Meta, title, CSS, favicons, etc. -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
{% endblock meta %}
<title>Page {% block title %}{% endblock title %}</title>
{% block stylesheets %}
<link rel="stylesheet" href='{% static "/login-assets/bower_components/bootstrap/dist/css/bootstrap.min.css" %}'>
<!--Bootstrap-->
<link rel="stylesheet" href='{% static "/vendors/datatables.net-buttons-bs/css/buttons.bootstrap.min.css" %}'>
<!-- Theme style -->
<link rel="stylesheet" href='{% static "/login-assets/dist/css/AdminLTE.css" %}'>
<!-- Custom Login style -->
<link rel="stylesheet" href='{% static "/login-assets/dist/css/custom-login.css" %}'>
<!-- Font Awesome -->
<link rel="stylesheet" href='{% static "/vendors/font-awesome/css/font-awesome.min.css" %}'>
<link rel="stylesheet" href='{% static "/vendors/font-awesome/css/font-awesome-animation.css" %}'>
<link href='{% static "/vendors/sweetalert/css/sweetalert2.min.css" %}' rel="stylesheet">
<style>
body {
width: 100%;
min-height: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
padding: 15px;
background-image: url("/static/images/login_background.jpg");
}
#particles-js{
width: 100%;
height: 100%;
background-size: cover;
background-position: 50% 50%;
position: fixed;
top: 0px;
}
.login-page{
margin-top: 10%;
width: 43%;
padding-top: 0%
}
</style>
{% endblock stylesheets %}
{% endblock head %}
</head>
<body>
{% block body %}
{% block content %}
<!-- {{ content }} -->
{% endblock content %}
{% block js %}
<!-- jQuery -->
<script src='{% static "/vendors/jquery/dist/jquery.min.js" %}'></script>
<!-- Bootstrap -->
<script src='{% static "/vendors/bootstrap/dist/js/bootstrap.min.js" %}'></script>
<!-- Sweet Alert2 -->
<script src='{% static "/vendors/sweetalert/js/sweetalert2.min.js" %}'></script>
<script src='{% static "/src/js/ajax-core.js" %}'></script>
<!-- jQuery -->
<script src='{% static "/build/js/particles-custom.js" %}'></script>
<!-- <script>-->
<!-- $(document).ready(function() {-->
<!-- $("body").prepend('<div id="particles-js"></div>');-->
<!-- });-->
<!-- </script>-->
<script src="/static/vendors/jsencrypt/jsencrypt.min.js"></script>
{% endblock js %}
{% endblock body %}
</body>
When web page is loaded , it is taking too much time . Can anyone suggest a solution to solve this issue?