Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 3 years ago.
Improve this question
When you click "save" on a form , 2 jquery events I know get triggered. Actually I was using both but just today I realised one is enough :) . But still let's say you define both, which one would be triggered first. $("#btnSaveForm").click() or $("#btnSaveForm").submit()
What I also noticed as soon as a click handler is triggered, the GUI basically freezes as long as this click handler is completely executed(Even if there is a ajax call done inside the handler). But still the GUI remembers what you did and executes the clicks afterwards.
The order of which things are executed is as follows :
User clicks the submit button
The onclick function is executed
The browser submits the page to the url specified in the action of
the form
As you can see in this example, the button triggers first and the form triggers right after.
Maybe you are using sync ajax handler if you are experiencing Frozen GUI after submitting your form.
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 2 years ago.
Improve this question
I need to be able to use javascript/jquery to update a field. But I need to be able to check whether the input was updated manually by the user or if the input was dynamically updated using a document.getElementById().value.
onChange() method seems to execute no matter if the user modified the control, or if I dynamically updated the control.
Any help? Is there something similar to onChange() that only executes when a user manually types/edits a control?
You can manually edit the .value of an input element, and as long as the element was not focussed by the user, an onChange event is not fired by most browsers.
OnKeyUp / OnKeyPress might be the event you are looking fo.
From MDN:
The input event is fired every time the value of the element changes. This is unlike the change event, which only fires when the value is committed, such as by pressing the enter key, selecting a value from a list of options, and the like.
Also, see this link onchange event not fire when the change come from another function
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 2 years ago.
Improve this question
So from my understanding of event listeners is that the action only applies to the element that you used the event listener on.
But say that I wanted to listen for a click on one element that is in a separate div, but the element I want to apply certain actions on is in a separate div. What would be the best way if possible in doing so?
To help visualize, im looking at this users example.
https://ryannathanwilson.github.io/Rock_Paper_Scissors/
And so from what it looks like it listens for a click on any of the buttons, and then the clicked button shows up in another area and then performs a specific action. Is this possible? Or am I understanding his code incorrectly and the elements that appear at the bottom when clicked is the original element?
You can write a function like this:
function myfunc(){
document.getElementById("abcd").value = "Lorem Ipsum";
}
And call this function on the element you want to listen on:
<button onclick=myfunc()>Click me! </button>
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
Suppose an application has a chat module containing messages. There is a jQuery click handler on said chat module that fires a series of focus related events whenever it detects a click.
Now suppose that when certain messages within the chat module are clicked, the event never bubbles up and a click event is never activated on the chat module.
How would I troubleshoot such an issue? I have a theory that somewhere in the application an intermediate element between the message click handler and the chat module click handler which is capturing the event and calling e.stopPropagation on it. There is currently no tools in Chrome to trace event propagation though.
What is the best way to trace event propagation in Chrome?
Override jQuery.Event.prototype.stopPropagation with a function containing a debugger statement:
jQuery.Event.prototype.stopPropagation = function() {
debugger;
};
From there perform the user actions that will fire the stopPropagation event; this time however a the debugger statement will cause the JavaScript to pause execution and you can observe the stack trace to see where it is being called from.
Put an ever-loving crap-ton of console logs everywhere. Not the most elegant solution, but it allows me to see what information is getting passed and where any and all hiccups are.
console.log(var);
I may suggest you to open the Chrome console (F12) go to elements, select the element of your interest and with right mouse click set the subtree modification.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
I have a jQuery application that adds a "tile" when i click "addTile" button. The resultant tile will have a menu of buttons (google, youtube, ...), which on click, removes the button menu and replaces it with the respective widget. This part is working fine. The next part includes adding the widget directly on load. Whcih means i have to programmatically click() the "menu" button which is not yet on the DOM. If i want to display a google widget directly on load of the document, how can i do that?
i am right now at this.
$(document).ready(function () {
$("#addTile").click().$("#setGoogle").click();
});
Do not try and click the button. That's impossible. Instead... only try to realize the truth...
There is no button.
You'll see, that it is not the button that clicks, it is the functionality of that said button that needs to be invoked directly.
try below thing
$(document).ready(function () {
$("#addTile").trigger('click');
$(document).on('click','#element_id',function(){
alert('click event is triggered');
});
$("#element_id").trigger('click');
});
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
I was wondering, what happens when a button is pressed and the specified "onkeyup" script is triggered while that script is running?
Thanks for your time!
When you have a function, that is bound to an event, and this event triggers, then this function will run as many times, as the event triggers. So if you trigger keyup event 5 times, the corresponding function will run 5 times as well.
If you want to avoid it, you should do some checkout. For example, I often do it, when work on some sliders. Here's an example:
$('.selector').click( function() {
if ( ! $(this).is(':animated') ) {
// further actions will occur, only if the ".selector" is NOT animated,
// regardless how many times you click it.
}
});