I am trying to determine the index of a clicked anchor element in my navigation using jQuery. However, when I use the following code snippet, I always get zero in the console:
$('.navigation ul li a').click(function(e) {
e.preventDefault();
var el = $(this).index();
console.log(el);
})
You can find a working example on this JSFiddle link.
If anyone has any suggestions or solutions, please let me know. Thank you.
Here is a suggestion:
$('.navigation ul li').on('click', function(e) {
e.preventDefault();
var index = $(this).index();
console.log(index);
})
To obtain the index, you can use the list provided. Insert your code below:
var el = $(this).parent().index();
Here's a suggestion for you:
$('.menu ul li ').on('click', function (event) {
alert($(this).index());
});
Another option to consider is:
let element = $(this).closest('li').index();
I recently attempted to implement the React Data Picker in my React project using npmjs. However, I encountered an issue when trying to import useState from import React, { useState } from "react"; The error message displayed: 'useState&a ...
Similar Question: How to retrieve a variable set during an Ajax request I am facing a challenge, as I am making an ajax call and receiving a number as the response. My query is, how can I assign this returned number to a variable that is accessible ou ...
This issue is specific to Safari, as it has been tested and works fine in Chrome, Opera, and Firefox. Upon hovering over a certain div (1), a child div (2) slides out by adjusting the left property. However, the child elements (buttons) within the second ...
After receiving a Vue.js project from GitHub, I attempted to download and run it. However, when I tried the command npm run serve, I encountered an error message: Syntax Error: Error: No ESLint configuration found in C:\Users\User\Desktop&bs ...
I'm in the process of implementing sticky navigation on my website that will dynamically change as users scroll through different sections. Specifically, when scrolling over a section marked with the class .dark, I want the logo and text color to swit ...
Recently, I made a transition from having a single-page website to using an express server for my website. During this process, I had to modify the file paths. However, I am encountering difficulties in loading my css and js files. Upon inspecting the dev ...
I'm new to the world of Github forking and pull requests. My goal is to fork a repository, make some changes, and test them out on a project before submitting a pull request. I've already forked the repository and made modifications, but I' ...
https://i.stack.imgur.com/W6NMa.pngWould it be beneficial to utilize an interface as a variable type rather than opting for any? For instance, if I have 3 functions where I am declaring variables that can contain alphanumeric data, would defining them us ...
I have a basic form enclosed in a modal window, dynamically generated using jQuery: <form name="altEditor-form" id="altEditor-form" enctype="multipart/form-data" role="form"> <div class="form-group"> <div class="col-sm-5 col-md- ...
Here is the example of HTML code that includes a price: <meta itemprop="price" content="121080"> I have created this search code, but I am unsure which tag to use for finding the price: const puppeteer = require('puppeteer&a ...
I've developed a React application using create-react-app. Currently, I'm working on creating a custom hook that integrates with the Microsoft Authentication Library (MSAL). MSAL provides a custom React hook that I want to utilize within my own ...
I encountered a coding scenario like this angular.forEach(config.tvshows.shows, function(show) { promises.push($http.get('http://epguides.frecar.no/show/' + show.replace(/\s|\./g, '') + '/next/')); }); re ...
Being new to node.js, javascript, and vue, I attempted to create a Currency Converter by fetching data from an API for exchange rates and performing calculations in a function. Despite successfully obtaining the exchange rates from the selected country in ...
I am struggling to get the restart button to display the start screen again. Even though I have called the restart function within the clearColors function, which should show the start screen, it hasn't been effective so far. Initially, in the fadeOut ...
Gravity Forms is being used to dynamically load checkboxes based on a dropdown selection through AJAX. Everything functions correctly until the form is submitted with invalid data (such as leaving a required field empty), causing all checkboxes to become u ...
When I run my JavaScript code in Firebug, it looks like this: tr=$(this).parent('tr'); tr.find('.img-delete').css('display','block'); However, I am unable to see the change reflected on the browser. Is there a wa ...
Currently, I am working with Angular 5 and have successfully subscribed to an observable with the use of the subscribe() method. My concern pertains to whether simply calling the unsubscribe() method on the subscription will be adequate for cleaning up all ...
I have developed a unique button that utilizes JavaScript to display the server status through an API. However, I am facing an issue where the server status does not automatically load when the browser is opened for the first time. You need to manually cli ...
Having to use two different bindingstrings is a requirement due to a tool used for creating PDFs. My objective is to have the corresponding bindingstring turn "Off" when a user clicks on either the Yes or No button, and have the clicked button turn to "Yes ...
The current value in my month variable is 2019-12. <p class="col-md-1"><?php echo $cm['month']; ?></p> I am looking to display the date as DEC 2019. ...