Jquery Class Button Click !!
jQuery $(".class").click(); - multiple elements, click event once
If you write your your code like this, the class .test-button will get multiple click events. For example, my data has 77 lines, so the each will run 77 times, that means i will decline the click event on the class 77 times. When you click the element, it will be fired 77 times. But if you wirte it like this: I have multiple classes on a page of the same name. I then have a .click() event in my JS. What I want to happen is the click event only happen once, regardless of multiple classes on my page.The scenario is that I am using AJAX to add to cart. Sometimes on the home page there might be a featured product and a top offer which means that the same class .add .#productid# is there and when clicked the add to cart AJAX is fired twice.
Apologies for bumping this old thread. I had the same problem right now, and I wanted to share my solution.
Having a .class selector for Event handler will result in bubbling of click event (sometimes to Parent element, sometimes to Children elements in DOM).
event.StopPropagation() method ensures that event doesn't bubble to Parent elements, while event.StopImmediatePropagation()method ensures that event doesn't bubble to Children elements of desired class selector.
Could we see your click handler? You're attaching 5 listeners to 5 different elements. However, when the user clicks on the element, only one event is fired.
when you click div with addproduct class one event is fired for that particular element, not five. you're doing something wrong in you code if event is fired 5 times.
then, if you need to perform something in the other elements with the same class on click on one ot them you can loop through the elements:
I just had the same problem.In my case PHP code generated few times the same jQuery code and that was the multiple trigger.
Simply enter code hereIn JQuery,ones event is triggered you just check number of occurrences of classes in file and use for loop for next logic.for identify number of occurrences of any class, tag or any DOM element through JQuery :var len = $(".addproduct").length;
I had the same problem.The cause was that I had the same jquery several times. He was placed in a loop.
And I was first scared to see my whole rows as a result in the Firebug console when I executed the code:
But then I realized that the click event was not fired, because no alert-dialog appeared. Firebug shows you just the elements which are affected by the click overiding. So there is nothing to worry.
I attach a click event handler on an OK modal button to act on click event of the object with class .archive-link.
On the first click, the event fires only on that .archive-link object that I asked the function to act on (var linkObj). But when I click the same link the second time and hit OK on the modal, the event fires on every object that has .archive-link that I clicked before.
I used the solutions above but unfortunately did not work. It was when I called .off() within the modal OK button click function that the propagation stopped. I hope this helps.
This question have been resolved and also got a lot of responses, but i want to add something to it.I was trying to figure out, why my click element his firing 77 times, and not one time.
in my code, i had an each, running a json response and displaying it as divs with buttons. And then i declared the click event inside the each.
If you write your your code like this, the class .test-button will get multiple click events. For example, my data has 77 lines, so the each will run 77 times, that means i will decline the click event on the class 77 times. When you click the element, it will be fired 77 times.
you are declaring the click element after the each. That means, the each will run its 77 times, and the click element will be declared only one time. So, if you click the element, it will be fired only one time.
I have found, when I am creating multiple duplicate elements with javascript and inject them into the HTML on page load, Jquery .click() does not work.
Then later, when you click this button, it will execute the delete_item() function and pass this into it for use later.
site design / logo © 2021 Stack Exchange Inc; user contributions licensed under cc by-sa. rev 2021.7.16.39771
By clicking “Accept all cookiesâ€, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy.
jQuery find ID of clicked button by class - Stack Overflow
For dynamically added buttons you can try the following method. above given method will only work if the button is present while loading the page $(document).on('click','.vote',function() var id=$(this).attr('id'); ); I have numerous buttons on my page with the same class names. However these buttons have different ID's. How do i do this:For dynamically added buttons you can try the following method. above given method will only work if the button is present while loading the page
site design / logo © 2021 Stack Exchange Inc; user contributions licensed under cc by-sa. rev 2021.7.16.39771
By clicking “Accept all cookiesâ€, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy.
javascript - JQUERY - add CSS class to BUTTON element after click
$('button.inactive').click(function() $(this).removeClass('inactive').addClass('clicked'); ); Should do the trick. This will clear the old class away from the button and give it the proper .clicked class. If the colour is resetting after using this solution, then the problem is elsewhere in your code. I want to change the background color of a button permanently after it is clicked. Using the following code the color only changes while the button is active/being clicked. Once the mouse button is released the added "clicked" class is no longer applied to the element.Applying the following code to an INPUT tag instead of a BUTTON tag works the way I need it to. However, I'm using a BUTTON tag since I want the value to be different from the text inside the button.
Should do the trick. This will clear the old class away from the button and give it the proper .clicked class. If the colour is resetting after using this solution, then the problem is elsewhere in your code.
site design / logo © 2021 Stack Exchange Inc; user contributions licensed under cc by-sa. rev 2021.7.16.39771
By clicking “Accept all cookiesâ€, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy.
javascript - jQuery addClass onClick - Stack Overflow
It needs to be a jQuery element to use .addClass (), so it needs to be wrapped in $ () like this: function addClassByClick (button) $ (button).addClass ("active") A better overall solution would be unobtrusive script, for example:I know I've got a lot of errors here, but that's why I'm posting. I've tried different scenarios with jQuery and without jQuery but I always end up with a broken solution (clicks suddenly stop coming through, class not added etc etc) so I decided to ask the pro's.
It needs to be a jQuery element to use .addClass(), so it needs to be wrapped in $() like this:
Try to make your css more specific so that the new (green) style is more specific than the previous one, so that it worked for me!
site design / logo © 2021 Stack Exchange Inc; user contributions licensed under cc by-sa. rev 2021.7.16.39771
By clicking “Accept all cookiesâ€, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy.
jquery - How to add click event by class name? - Stack Overflow
Most efficient solution for your scenario in this case would be: // $ ('.mmenu').on ("click", ".menu_button", function () { // jQuery 1.7 & up $ ('.mmenu').delegate (".menu_button", "click", function () var id = $ (this).attr ('id') // or this.id if ( id == "m1" ) // ..code ); I would suggest to use the live function, instead of the .click, because the elements added on run-time will also be clickable.In this way, you have only one click event bound to the main div $('.mmenu'), which will also work if you add elements (new li with divs) in the future
But if the code is completely different for each button, then it may not be useful to use it like that but instead bind a different handler per id.
Yes. You can bind a click event handler to any set of DOM elements, whether they're selected by class or anything else. The syntax in your example is correct, and the event handler will be bound to each element matched by the selector.
However, bear in mind that in your example id will be undefined. You would have to use this.id, as this will refer to the element that has been clicked.
site design / logo © 2021 Stack Exchange Inc; user contributions licensed under cc by-sa. rev 2021.7.16.39771
By clicking “Accept all cookiesâ€, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy.
Posting Komentar untuk "Jquery Class Button Click !!"