$ (this) .find ('input [type = "submit"]: not (.cancel), button'). click (function () - what is it?

Question

Can someone help me understand this jquery line of code ?:

$(this).find('input[type="submit"]:not(.cancel), button').click(function () 

I'm particularly interested in .cancel , since the entire jquery code snippet (not included here) is used to validate the page, and I'm trying to prevent validation if the user clicks the cancel button. I assume that the above line of code says that the submit button pressed is NOT a cancel button, and then continues.

But I do not know how to assign a button as a cancel.

Answer 1

It basically searches for items that are in this that have the following requirements

• is input
• has type = submit
• does not have cancel class

OR

• - button

Answer 2

Good answers here. Perhaps this annotated version adds some value.

 $(this) // within this jQuery object .find(' // find all elements input[type="submit"] // that are input tags of type "submit" :not(.cancel) // and do not have the class "cancel" , // or button // are button elements ') .click( // and for each of these, to their click event function (){} // bind this function ); 

Answer 3

They use a CSS class called Cancel to basically symbolize the Cancel button (then by checking it with a button without this class)

Although I did not know that you can use an asterisk ( * ) in the CSS class name.

Nevermind, you tried to make bold code inside a code block

I am also wondering why they make the submit type cancel button when they want it to cancel anyways. (It seems that <input type="button" ... /> would be better suited).

Answer 4

.cancel is a class selector. In particular, it looks for input elements with a type attribute set to submit , but does not have a cancel class. It is also looking for items with a tagName button .

You can "designate the button as undo" as follows:

 <input type='submit' class='cancel' /> 

Answer 5

basically it is a selector that says give me submit buttons without canceling the class and buttons and apply a click handler. try to find the following selectors

tag .class: Not