function to fire on button [closed] - javascript

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 5 years ago.
Improve this question
I have button with id = btnadd And java script file “myscript” which is referenced in layout page.
I want this function to fire on button click but this doesn’t happen. Could anybody tell me what is the error here?
View script like this:
myscript java script file like this:

Use this code instead:
$(document).on("click", "#btnaddd", function() {
alert("click");
});
If it still does not work then you might have used the same ID btnadd for two different elements and JQUERY only matches the first one.

Maybe multiple elementes with de same id, you can see this code at jsfiddle.
$(document).ready(function() {
$('#mybt').click(function(){
alert('s')
})
});

Related

jQuery loses added class [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 5 years ago.
Improve this question
I have several buttons with a class mybtn. I need to set a class mybtn-active on the one that is clicked, and remove it from the one that has it at the moment.
$('.mybtn').on('click', function () {
$('.mybtn-active').removeClass('mybtn-active');
$(this).addClass('mybtn-active');
});
When I click on a button, currently active loses its class, as it should. But the clicked one doesn't get the class.
I passed through the script with Chrome debugger and it works. It just loses the class when the code exits the script. Any ideas?
[SOLUTION] by #musefan
The buttons were <a> tags in the background, which I didn't think about because this is the code I inherited, I didn't write the HTML. And that was the problem. See the accepted answer.
Assumptions
I am going to take a massive gamble here, but it's the only thing I can think of that would explain what the OP is describing and could actually happen with that code. We would need the OP to provide HTML to validate my assumption.
I am also assuming that the class selector in the sample code is a typo of the question, and is not a problem in the original code (as the OP specifically says the removal of the classes is working correctly).
My assumptions have since been validated by the OP in comments on this answer and other answers.
Problem
I expect your problem is that you are using either a elements and your click is actually reloading the page, or using buttons that are also having the same effect, thus causing all classes to revert to default.
Solution
You can fix this by using the arguments of the click event as follows:
$('.mybtn').on('click', function (e) {
e.preventDefault(); // This prevent the hyperlink from reloading the page.
$('.mybtn-active').removeClass('mybtn-active');
$(this).addClass('mybtn-active');
});
You are missing a
.
in the selector on your second line.
It should be
$('.mybtn-active').removeClass('mybtn-active');
As I have mentioned in the comment, it is typo mistake. You have to change $('mybtn-active') to $('.mybtn-active'). Look at the snippet.
$('.mybtn').on('click', function () {
$('.mybtn-active').removeClass('mybtn-active');
$(this).addClass('mybtn-active');
});
.mybtn-active {
font-size:25px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="mybtn">Button1</button>
<button class="mybtn">Button2</button>
<button class="mybtn">Button3</button>
<button class="mybtn">Button4</button>

Event listeners on chrome extension class of buttons doesn't seem to work, or the action of the listener doesn't work? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
I am trying to make a chrome-extension popup-window whereby an user can add a specific tab's URL or delete one or delete all. The delete all works fine, the add URL does the trick too. However, the 'delete one link' doesn't work at all and I have really been struggling with that department. I hope someone could help me out with this one because I don't know what the problem is. Here are the files:
popup.js: gist.github.com/kobrajunior/4852f85ae18cfb9edbe542a820b8c107
popup.html: gist.github.com/kobrajunior/1c26691734c19391c62dc336ed2e1791
manifest.json: gist.github.com/kobrajunior/78acda830c2d1c384333542422f1494d
I have read on other posts that it may be because the getElementsByClassName doesn't return a 'real' array by which you can manipulate things with functions, if that's true, than I'm all out of tools to solve this one.
The 'X' button doesn't work :
Clear everything buttons works as expected :
In your removeMe() function you have to remove your DOM element from its parent element. Something like this:
function removeMe(i) {
// remove it from the DOM
var list = document.getElementsByClassName('items');
list[i].parentNode.removeChild(list[i]);
list.splice(i, 1);
// remove it from chrome-storage
chrome.storage.local.get({urlList:[], titleList:[]}, function(data) {
urlList = data.urlList;
titleList = data.titleList;
urlList.splice(i, 1);
titleList.splice(i, 1);
// update chrome storage
saveList();
});
}
Or you could just use your main list id:
document.getElementById("list").removeChild(list[i]);

Change .text() of a div not working [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
I cannot get jquery to change the text of a div. I have gotten the code to work on jfiddle but on the live site it is not being detected. I have even tried to add the function to (document) click so it ensure the function runs.
$(document).click( function () {
var ptime = $('#vaptimelineblock0').text();
if (ptime == "07:00 PM") {
$('#vaptimelineblock0').text("7:15 pm");
}
});
The live project is located
http://ecofreshdrycleaners.com/component/vikappointments/?view=servicesearch&id_ser=2
EDIT:
Here is the jfiddle working
https://jsfiddle.net/cts5bfud/
As already said in comments you need to fix error Uncaught TypeError: Cannot set property 'value' of null
Cause of that error is this code:
document.getElementById("couponkey").value=document.getElementById("couponcode").innerHTML;
You don't have element with id 'couponkey'.
Remove this code and it all works fine (or set element with that id properly).
Use this:
$('#vaptimelineblock0').html("7:15 pm");

Angularjs: Ajax works 2x. Please Help me [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
ajax worked 2x.
please see this
If you are using a function inside the template, it generally will run twice times. That is the way AngularJS ensures the function was ran.
You can see the same happening in this JSFIddle example.
HTML:
<div ng-app>
<div ng-controller="ExampleCtrl">
{{hey()}}
</div>
</div>
JS:
function ExampleCtrl($scope) {
$scope.hey = function() {
console.log('here i am');
}
}
So, what to do?
Do not load the data using a function in the template, load it directly when the controller is initialized. As in this example.
function ExampleCtrl($scope, $http) {
$http.get(...);
}
PS: are you not using the get method from jQuery, yep? Please. AngularJS has your own http methods. See here.

one class two onclick functions on one item, can someone help me please [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 3 years ago.
Improve this question
i cant get the LcloseNav to work.
heres my code i used.the KclosNav work in this code but the LcoseNav does not, seperately they work but joined seems im doing something wrong here, please help with this.thank you.
<div id="KmySidenav" class="Ksidenav">
&times
</div>
Hi Gareth you should have a function that call both KcloseNav and LcloseNav
then your html should be something like this:
<div id="KmySidenav" class="Ksidenav">
&times
</div>
<script>
function closeNavs() {
KcloseNav();
LcloseNav();
}
</script>
It's better to use eventListener
I would do it this way - Change <a> to a button.
<div id="KmySidenav" class="Ksidenav">
<button type="button" class="Kclosebtn">&times</button>
</div>
Add event listener
document.querySelector('.Kclosebtn').addEventListener('click', (e) => {
KcloseNav();
LcloseNav();
});
Here's explanation:
We are using querySelector to get .Kclosebtn button. Next, we are adding click eventListener. And when someone clicks on it, it will invoke KcloseNav() and LcloseNav() functions

Categories