Trigger button click event programmatically using JavaScript or jQuery on page load in Internet Explorer

I have this piece of code

window.onload = function () {
    $('#btnFilter').click(function (e) {
        btnFilter(e);
    });
}

The function works on button click but I need that the button is clicked when the page opens. I've tried things like $('#btnFilter').trigger( "click" ); but the button still not clicked on page opening. How can I achieve this thing? I can't just call the function because I get the error "Cannot read property 'currentTarget' of undefined" beacuse I don't give any event as parameter.

function btnFilter(e) {
    element = e.currentTarget.parentElement;
    //other code
}

You can try like this:

$(document).ready(function(){
    $('#btnFilter').trigger('click');
});

$(document).on('click','#btnFilter',function(e){
    btnFilter(e);
});

function btnFilter(e)
{
    element = e.currentTarget.parentElement;
}

.trigger(), A string containing a JavaScript event type, such as click or submit . They can be fired manually, however, with the .trigger() method. Clicks to button #2 also trigger a click for button #1. Browser Events � Document Loading � Event Handler Attachment � Event Object � Form Events � Keyboard Events � Mouse Events. Let us have a button in our website which on click writes a welcome message in the document. But let's trigger it on window load event and manually trigger the button event. In all other browsers, we initialize mouse event by instantiating a new MouseEvent(. , .). Internet Explorer doesn't support MouseEvent action. It throws an action not


You can change your 'btnFilter' to accept the button instead of the event:

function btnFilter(element) {
    element = element.parentElement;
    ...
}

$(function() { 
  $("#btnFilter").click(function(e) { btnFilter(this); return false; });

  // Pass the button to the filter operation on load
  btnFilter($("#btnFilter")[0]);
});

alternatively, accept the parent element directly

$(function() { 
  $("#btnFilter").click(function(e) { btnFilter(this.parentElement); return false; });

  // Pass the button parent to the filter operation on load
  btnFilter($("#btnFilter")[0].parentElement);
});

Programmatically Opening a File Dialog with JavaScript — Marius , It is possible to programmatically open a file dialog in JavaScript, but a click event on a hidden <input type="file"> whenever the photo button <script src=" https://code.jquery.com/jquery-2.2.4.js"></script> <script> Let's now try to automatically open the file dialog immediately after the page has loaded: Once you have the Id of the control that you want to programmatically click, you can use the JavaScript .click() function to trigger a button click event. Naturally the JavaScript and JQuery syntax is slightly different, in particular with how the click event is hooked up to the button. In traditional JavaScript you need to add an onClick() method to the HTML object itself. On the other hand, JQuery encourages separating script from HTML markup in adding the click event to the button in the


If you use jquery i would keep it coherent and not mix it with vanilla javascript. A Jquery solution is:

$(document).on("click", "#btnFilter", btnFilter);
$(document).ready(function(){$("#btnFilter").click()});

or

$(document).on("click", "#btnFilter", btnFilter);
$(document).ready(btnFilter);

In you solution the error is the event binding: when you bind the event to #btnFilter on page load, the element is not existing yet, so the function cannot be triggered.

HTMLElement.click(), This event then bubbles up to elements higher in the document tree (or event chain) and fires their click events. Syntax. element.click(). Example. Trigger a Button Click on Enter. Press the "Enter" key inside the input field to trigger the button: Button


jQuery Solution:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").trigger("click");
});
</script>
</head>
<body>

<button onclick="alert('clicked')">Click</button>

</body>
</html>

Events – You Don't Need jQuery! – Free yourself from the chains of , Back when it was common to support IE8 or something even with events using vanilla JavaScript in older browsers. 'click', function() { // TODO event handler logic }); and radio buttons may not trigger a change event at all. which can be used to detect when the DOM is ready. The trigger() method triggers the specified event and the default behavior of an event (like form submission) for the selected elements. This method is similar to the triggerHandler() method, except that triggerHandler() does not trigger the default behavior of the event.


How To Change The Browser To Fullscreen with JavaScript, Fullscreen Window. How to use JavaScript to view an element in fullscreen mode . Click on the button to open the video in fullscreen mode:. To trigger handlers bound via jQuery without also triggering the native event, use .triggerHandler() instead. When we define a custom event type using the .on() method, the second argument to .trigger() can become useful. For example, suppose we have bound a handler for the custom event to our element instead of the built-in click event as we


Dino Esposito on jQuery Events, Triggering Events Programmatically Internet Explorer has its own eventing model, as do Firefox and Safari. Finally, the third argument is the JavaScript function to bind. To simulate the user clicking on a given button, use this: The jQuery library supplies three commonly used event methods: ready, hover, toggle . How to simulate a click event with vanilla JavaScript The other day on Twitter, Oliver Williams asked me: How would I write a vanilla equivalent of jQuery .click() (with no arguments) to trigger a click event even when a real click hasn’t occurred? If you Google this, you might get excited to discover that vanilla JavaScript has a click() method.


The Dangers of Stopping Event Propagation, If the click event originated from inside #menucontainer , stop that event so it will Rails ships with a JavaScript library called jquery-ujs that allows developers to We know there's bad advice on the Internet promoting the unnecessary use of The browser has to go through every single ancestor element of the event� // Get the button, and when the user clicks on it, execute myFunction document.getElementById("myBtn").onclick = function() {myFunction()}; /* myFunction toggles between adding and removing the show class, which is used to hide and show the dropdown content */