js simulates clicking and submitting a form as an example, compatible with mainstream browsers_javascript skills

In actual application development, we often use JS module events, but sometimes we encounter some problems, such as click events. For a simple example, click the "Submit" button outside the form to submit the form. Let’s code.

Html:

Copy code The code is as follows:

Please click "Submit" and the click event of the test submit button is also triggered.

Submit

Javscript:

Copy code The code is as follows:

After testing, there is no problem with IE, FF, Chrome, Opera, and Safari, and the form can be submitted normally.

But in actual design, in order to make the submit buttons look better, builders often use a tag to process them and add a background image to simulate the button. We still use the above idea to try and add an a tag to submit the form, we only modify the html.

Html:

Copy code The code is as follows:

Please click "Submit" and the click event of the test submit button is also triggered.

Submit

Simulate submit button

Javascript:

Copy code The code is as follows:

After running, the problem occurred. IE, FF, Opera are all OK, but Chrome and Safari cannot run normally. Later, I searched online and found a Labels do not have the same onclick() event as buttons. The solution is to write different logic for IE and FF. The JS code is as follows:
javascript:

Copy Code The code is as follows:

At this point, the problem is solved. Although this problem is very simple, it is easily ignored by everyone. I posted it to share with everyone.

Syntax:

createEvent(eventType)

Parameter Description

eventType The event module name of the Event object you want to get. See the Description section for a list of valid event types.

Return value

Returns a newly created Event object with the specified type.

Throws

If the implementation supports the required event type, this method will throw a DOMException with code NOT_SUPPORTED_ERR.

Description

This method will create a new event type, which is specified by the parameter eventType. Note that the value of this parameter is not the name of the event interface to be created, but the name of the DOM module that defines that interface.

The following table lists the legal values ​​of eventType and the event interface created by each value:

Parameter event interface initialization method
HTMLEvents　HTMLEvent　iniEvent()
MouseEvents　MouseEvent iniMouseEvent( )
UIEvents　UIEvent　iniUIEvent()

After creating the Event object using this method, the object must be initialized using the initialization method shown in the table above. For more information about initialization methods, see Event Object Reference.

This method is actually not defined by the Document interface, but by the DocumentEvent interface. If an implementation supports the Event module, then the Document object implements the DocumentEvent interface and supports this method.