Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 3 years ago.
Improve this question
I am a Japanese web developer.
I am not good at English , but I want to be better.
Sometimes, I see function starts with "on" , like "onResize" , "onDrop".
What is this "on" meaning?
I thought this "on**" means like "when ** ( happened )".
So, I thought it would be better to say "onResized" , not "onResize".
Or "onWindowResized" , not "onWindowResize".
Can someone please tell me , what is the meaning of "on"?
Thank you so much for a lot of answer.
I read them all.
Well, what I thought is that if you say "onWindowResize" I feel like the window resizes them self by own.
But the one who resizes the window is us.
And window is something that is resized by us.
So I feel weird to hear "onWindowResize".
Well but I am bad at English , and my feeling of English should be wrong.
For no confusion, You can easily think on as it is being happening, not always the completion.
onChange for example, something is being changing(event) so we might add some event-handler for that event.
For your edited question, It doesn't matter that who resizes the window.
You can focus it to event - event-handler relation.
When someone (maybe your user) changes the window size using his/her mouse, you can add some event-handler like alert("window is being resized") to onWindowResize event which means window resizing is being happened.
It works like the English phrases "dead on arrival" or "cash on delivery". Arrival and delivery represent events in time, so in javascript it is like saying "take action on event", where the action is the associated function and the event is the javascript event.
Using "on" before any function, its just a convention. As an example, in react most of the developers define their function with two ways -
handleResize
resizeHandler
I think, on indicates - this function is doing/did/will do something according to any event.
Like you want to remove a div when clicking a button, you can define this function like onRemove.
When it say on[Verb] it mean when [Verb] happened or being happen: not always after happened.
Related
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
well, I just downloaded a code from internet and it has
login
when i click on it, it shows a pop up.
I want to use that pop on any other button , but does no know how to do that. can any one please explain me how it can be done or how the current given line is working.
I am just new to this, so please dont be mad if it is a stupid question.
Thank you
javascript:void(0) returns undefined, so the link does not actually lead to anywhere when clicked and the normal <a> element behavior is suppressed. That means there's a click handler set up on the element that handles showing the popup. This click handler is found somewhere else in the code.
I'm assuming that the click handler is associated with the action class, so if you attached class="action" to another element, you'll probably see the popup.
To create "pop ups" (actually known as alerts), you use the following code:
alert(yourStringMessageHere);
The javascript: part of the code you are showing simply tells the HTML parser that when the hyperlink is clicked, the following JavaScript should be executed. void(0) is asking for the expression 0 to be evaluated and since 0 is another way of expressing false, the expression essentially winds up causing nothing to happen, which when added to a hyperlink's href attribute is sometimes desirable. This code does not cause a pop up to appear. If you are getting one, it is because of something else.
Lastly, including JavaScript into html in this way is strongly discouraged as it is bad form and can lead to code that is difficult to read and maintain. JavaScript should be separated from HTML.
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
This seems to be impossible with the typical "inspect element" approach, which seems great for HTML and CSS, but that's it. I can't go to a particular element and then link to the particular JavaScript that's controlling it. Is there any way to do this?
As someone else said, there is no precise notion of "the JS controlling an element". There is JS which does something to an element, and there is JS which handles an event on a element. To handle these cases:
In Chrome devtools, select the element, right-click, and select Break on.... This will break when something happens to the element, such as a change in its children or its attributes, and leave you on the line that was making the modification.
Use "Event Listener Breakpoints" and choose to break on a particular event. Then initiate that event on an element which is listening for it, such as by clicking on the element. The debugger will take you to the line handling that event (which might be deep within jQuery, but that's another story).
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 9 years ago.
Improve this question
I'm rather new to Javascript and some of the syntax is not very clear to me. I've usually copied example code from the internet when I needed it, but I would like to understand it better.
Can someone explain, in simple terms, how javascript knows to call the function supplied, and how it knows to do it asynchronously? Is there something that tells it do do this, or is it just built into the language?
Thanks
Whenever you want to something when something happens (and that something is outside the control of JavaScript (e.g. "When the user clicks on a button" or "When the HTTP response is received from the network".)) you typically use an Event Listener.
This is a function that you tell JavaScript to run when the event happens.
They are typically set up by using the addEventListener method or by assigning a function to a property with a predefined name on the right kind of object.
When the event happens some code (typically (in a browser this is almost always) provided by the underlying environment) will check to see if any appropriate event listener functions exist and executes them.
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 9 years ago.
Improve this question
I've been writing Javascript with jQuery for a while, I can make it do what I want, but I've never written anything really reusable or modular. Now it's time for me to take that step and write proper reusable Javascript.
I thought I'd start with something I've implemented countless times, a confirm delete dialog. I want to be able to specify a function to execute on confirm and a function to execute on cancel.
The way I see this working (and this is open to criticism) is to do something like:
$(element).confirmDialog(function(){
// this is the cancel callback
},
function(){
// this is the confirm callback
});
I'd also like the dialog to show based on a data attribute on the link, rather than having to write an .on('click'... handler each time, but I don't know how to 'link' the specific confirmDialog with the function which handles the .on('click'....
This is really as far as I've got so far. I know that as I want to be able to add the functionality to any element I need to define confirmDialog() as $.fn.confirmDialog = function(){...}.
Although I can implement the entire thing in an ad-hoc way, I'm unsure as to how to implement this functionality as a clearly defined, loosely coupled reusable module.
Could someone help me get my head around how to structure this module, or provide a link to a very thorough tutorial which is specifically about writing reusable Javascript?
You can read more about how to create jQuery plugins at the following links:
http://learn.jquery.com/plugins/basic-plugin-creation/
http://www.codeproject.com/Articles/291290/How-To-Write-Plugin-in-jQuery
NetTuts videos are particularly useful:
http://net.tutsplus.com/articles/news/learn-how-to-create-a-jquery-plugin/
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 8 years ago.
Improve this question
Help needed to understand the source code...
I visited the website bseindia.com some time ago and when i was checking for its coding i couldn't understand the action performed when you click on the buttons aligned horizontally at the top (About BSE, Markets, etc). The anchor have href attribute with value only "#". I could use something like that in my upcoming project so i would appreciate some help.
please tell the use of empty "#" in anchor tags href does and if any other language like Server-side etc then please do tell me.
This is a common practice. Actually these kind of links are used more like "buttons". I mean, the url will not change, but some action will happen, based on the javascript implementation.
Please read this post, to learn more: Which "href" value should I use for JavaScript links, "#" or "javascript:void(0)"?
please tell the use of empty "#" in anchor tags
It is a relative URL to the top of the current page.
If anything else happens when the link is clicked, it is because client-side JavaScript is involved.
Binding JS to links to the top of the page is a common practise, but a poor one. It is neither Progressive nor Unobtrusive.
The # is to keep the styling of the link (I think that is what it is for, not sure). An action takes place because javascript registers event handlers on the link, such as this:
html:
test
javascript:
document.getElementById('test').onclick=function(){
alert('you clicked it!');
}
here is a jsfiddle: http://jsfiddle.net/fZ2JQ/