Javascript has ceased functioning on the current server, however it is operational on a different

Need a hand with this tricky issue.

The company I'm with has its own website. I've been updating pages on the site for the past few days.

After finishing my updates and trying to upload the site, all of a sudden, the JavaScript stopped working.

Whenever I press f12, I see these error messages:

Uncaught SyntaxError: Invalid or unexpected token

base.js:1 Uncaught ReferenceError: $ is not defined at base.js:1

Everything works fine on my test server.

But on the the main server, it's all haywire.

Any idea what could be causing this? It's not just one page - it's all of them where the JavaScript fails.

[update]

I'm aware there are different versions of JavaScript. The testing environment on our website already addressed this. Yet, the problem persists.

Appreciate any insights,

Wesley

Answer №1

It has come to our attention that on the test site, jQuery 3.3.1 is being used:

<script src="js/jquery-3.3.1.min.js" type="text/javascript"></script>

However, on the main site, jQuery 1.10.1 is currently in use:

<script src="https://www.aska-ltd.jp/js/jquery-1.10.1.min.js"></script>

We recommend using version 3 across both sites unless there are specific requirements for a different version.

Answer №2

It seems like your JavaScript code is utilizing jQuery.

On the initial page, there is a script tag to load jQuery in the header:

<script src="js/jquery-3.3.1.min.js" type="text/javascript"></script>

However, on the subsequent page, jQuery is not being loaded.

Without knowledge of your server's file structure, I cannot provide the exact path. Make sure to load jQuery similarly on your corporate site.

UPDATE:

I've observed that you are loading jQuery from

https://www.aska-ltd.jp/js/jquery-1.10.1.min.js
. This file differs from the original one (compared with
https://code.jquery.com/jquery-1.10.1.min.js
using MD5). If you prefer to use this older version (not recommended), you can attempt to re-download it or opt for the latest version from the official server (recommended).

Answer №3

As mentioned by @NoobTW and @SapuSeven, there seems to be a jQuery script error on the live site.

To resolve this issue on the live site, you can try replacing the current script tag:

<script src="https://www.aska-ltd.jp/js/jquery-1.10.1.min.js"></script>
with the following updated version:
<script language="JavaScript" type="text/javascript" src="js/jquery-3.3.1.min.js"></script>

Alternatively, consider loading jQuery from a CDN for a more streamlined approach. Here is one option using jQuery 3:

<script
  src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
  integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E="
  crossorigin="anonymous"></script>

For additional options, you can explore the resource available at:

Answer №4

The main server is having trouble loading JQuery properly. I attempted to inspect the code from the file stored on the server, only to find that the JQuery file being returned appears to be corrupted in some way.

If this issue persists with a newer version of JQuery, it's worth investigating if the updated file is also affected by corruption. It’s possible that there is an error occurring during the server’s handling of these files.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Acquiring the specific checkbox value using JQuery

I am encountering an issue with my JQuery function that is supposed to print out the unique value assigned to each checkbox when clicked. Instead of displaying the correct values, it only prints out '1'. Each checkbox is assigned an item.id based ...

The Kendo Date Picker is failing to update properly when the k-ng-model is modified

I am facing an issue with my code involving two date pickers and one dropdown list. I want the date pickers to change based on the selected item from the dropdown list. Here is the relevant portion of my code: $scope.toolbarOptions = { i ...

What is the best way to open a browser window at a quarter of its default size?

Is there a way to open a window at 25% of its default device browser window size? I attempted the code below, which worked. However, it only accepts pixel inputs and not relative % values. This makes it non-scalable across various devices. window.resizeT ...

Error message in vuejs: JSON parsing error detected due to an unexpected "<" symbol at the beginning

I have been trying to troubleshoot this issue, but I am having trouble understanding how to resolve it. Currently, I am using lottie-web in a project and need to set the animation parameters on an object in order to pass them as a parameter later. This i ...

What is the method for sending one URL as a parameter within another URL?

When I try to access the route /new/:url with a request like /new/https://www.google.com, the response is Cannot GET /new/https://www.google.com. What I actually want to receive is the string https://www.google.com. I came across an answer on URL compone ...

Concealing option value based on ng-if conditions in AngularJS: A guide

I am designing an Input form with two input fields that need to be compared and values displayed if a certain condition is met. The input fields are: <td class="td_label"><label>Client Age :</label></td> <td class="td_input"> ...

using node and express to route and pass variables to a required module

In my primary index.js file, I have the following code: var express = require('express') require("dotenv").config(); const db = require('./services/db_service').db_connection() const customers = require('./routes/custo ...

How can a Link be used to open a component in Material-UI V 5.0 when using a MenuItem with onClick={popupState.close}?

Hey everyone, I spent the entire Sunday trying to create a dropdown menu in the AppBar but encountered various errors. The only menu that worked without any issues was using the "PopupState helper" which can be found at https://mui.com/material-ui/react-me ...

Retrieve the content of a specific HTML tag using JavaScript

Is it possible to extract the content of a specific HTML tag as a string or XML format? <body> <script src="jquery.min.js"> //var test = document.getElementsByTagName("input"); //alert(test[0]); $(document).ready(function ( ...

"Proceeding to" express this redirection

Greetings, I am currently struggling to understand why res.redirect('/index') is rendering like this: <p>OK. Redirecting to <a href="/index">/</a></p> Instead of directly redirecting on the page. I searched through th ...

Using the class attribute for Pagedown instead of the id keyword

I am utilizing Pagedown, which necessitates giving the id wmd-input to a textarea. This requirement is outlined in Markdown.Editor.js as follows: function PanelCollection(postfix) { this.buttonBar = doc.getElementById("wmd-button-bar" + postfix); ...

Utilize Protractor to extract the text within a specified span element

Is it possible to check if the text of the span within the button is "Vigente" using expect and Jasmine? If so, how can I achieve this? <button _ngcontent-hke-28="" class="btn btn-success disabled" tabindex="-1"> <span _ngcontent-hke-28="" class= ...

How to use the transform function in JavaScript

Hey there, I'm looking to create a new function. I am just starting out with javascript. I want to wrap the code below in a function like: ConfirmDelete() { }; This function should perform the same action as this code snippet: $('.btn-danger ...

Issues with visuals in jQuery.animate

I have nearly finished implementing a slide down drawer using jQuery. The functionality I am working on involves expanding the drawer downwards to reveal its content when the handle labeled "show" is clicked, and then sliding the drawer back up when the ha ...

Here are the steps to divide an array of objects into separate objects based on their keys

The data I currently have is formatted like this: [{ "Consumer": [{ "Associated ID": "JSUDB2LXXX / BIC 7503 / US", "Parent Consumer": "7503" }], "Owner": [{ &qu ...

Unveiling the information retrieved from an AJAX request during page load

I've been working on a unique concept for my website. Instead of displaying data from a JSON file upon load, I want it to render only when a specific click event occurs. Initially, I tried using callbacks but soon realized the flaws in that approach. ...

The concept of recursively exporting modules in Node.js modules

Looking for a way to recursively export all .hbs files in a NodeJS 14+ project main JS. I attempted the following: module.exports = () => ({ partial : __dirname + "/../partial/**.hbs", helper : __dirname + "/../helper/*.js" } ...

AngularJS powered edit button for Laravel route parameter

I have a data list that needs to be edited using an edit button. When clicking the edit button, I need to send the ID to a Laravel controller in order to fetch the corresponding data. The initial listing was created using Angular JS. <a class="btn" hr ...

The target for ajaxSubmit is being duplicated instead of being replaced

I encountered a problem with the code below: $('#refresh').click(function () { alert($('.report-container').length); $('.report-container').each(function () { var accordian = this; var url = $(this) ...

What is the best method to fill a mat-select dropdown with an existing value?

I am encountering an issue with a mat-form-field that contains a dropdown of data fetched from an API. I can successfully select an option and save it to the form. However, upon returning to the dropdown or reloading the page, the saved value does not appe ...