Develop Reference

Change onclick event

I have a button which redirects the user to the previous page:
<button id="back" onclick="location.href='..'">Back</button>
And I want to change his location to two pages before.
What's wrong with this code?
document.getElementById("back").setAttribute("onclick", function(){window.location.href='../../'});
or this
document.getElementById("back").addEventListener("click", "location.href='../../'");
or this
document.getElementById("back").onclick="location.href='../../'";
for some reason none of them work properly and my button remains unchanged... Google doesn't help!

Try
document.getElementById("back").addEventListener("click", function(){
window.location.href='../../';
});

You can do like below
<button id="back" onClick="GoBack()">Back</button>
<script>
function GoBack(){
window.location.href='../../';
}
</script>
And If you want to go back to the previous page you can do like bellow
<button id="back" onClick="GoBack()">Back</button>
<script>
function GoBack(){
window.history.go(-2);
}
</script>

I think this is better
document.querySelector("#back").addEventListener("click", () => window.history.go(-2));

you can use this windows.history.go(-2);:
<button onclick="windows.history.go(-2)">Back</button>
or save address of previous pages and reference to them.

setAttribute for onclick doesn't works in some browsers. Read about it here.
Syntax for addEventListener is
target.addEventListener(type, listener [, options]);
Read about it here
So, Working code
document.getElementById("back").addEventListener("click", function(){
window.location.href='../../';
});

Link to a HTML page inside a Javascript function

I want to link to a HTML file from a JavaScript on-click function. For that I used following function.
onClick: function () {
document.link("about.html");
}
But this is not working. So how can I add link inside of onClick function. Can anyone help me.

Usually I use this code:
<input type="button" value="Go to page" onclick="location.href='mypage.html'"/>
Anyway u can try:
onClick: function () {
location.href("about.html");
}

You can use the onclick property of a button element in HTML that will trigger a function when the button is pressed.
<button onclick="myFunc()">click me</button>
In your JavaScript file, you can then create the myFunc() function that will be called and executed soon after.
function myFunc() {
window.location = "otherpage.html";
}
According to W3C it's safer for cross-browser compatibility to use window.location rather than document.location.

onclick:function(){
window.navigate('your_url');
}

Try this:-
<input type="button" value="Go to page" onclick="openUrl()"/>
function openUrl() {
window.open("about.html");
//or
//window.location.href= "about.html";
}

Calling a function from a HTML button

I wonder what I am doing wrong in this case? I got this button which is an HTML element. When I click on it, I want the function push() to get activated. Unfortunally my console says:
ReferenceError: push is not defined
Can some one help me in this case? Thanks so much!
<button type="button" onclick=push()>Click Me!</button>
<script type="text/javascript">
function push (){.....};
</script>

You can change onclick=push() to onclick="push()" to make it work!
Also, there might be something wrong in the body of the push function because of which it is not able to compile - hence, the error.

You could do these instead :
You can do this if you want to use the function push() with only one button,
<button type="button" id="clickme">Click Me!</button>
<script type="text/javascript">
document.getElementById("clickme").addEventListener("click", function() {.....}
</script>
And this if you want to use the function push() with multiple button,
<button type="button" id="clickme">Click Me!</button>
<script type="text/javascript">
document.getElementsByClassName("clickme").addEventListener("click", function() {.....}
</script>
Pros : Less HTML
Cons : More javascript

jQuery onclick registration error

I have a button that I want to attach a click listener to, but everytime the code runs, it throws a console error
jquery.js:4435 Uncaught TypeError: ((n.event.special[g.origType] || (intermediate value)).handle || g.handler).apply is not a function
Here's the js code that triggers the error, the first line runs fine, the second line is the one that causes the error
$toolbar.off('click', '.btn-save'); // $toolbar is assigned $("#toolbar") on init
$toolbar.on('click', '.btn-save', function(e){
saveData(0);
});
What confuses me is, if I run that bit of code manually through the console, I get no errors
Here's the HTML
<div class="row" id="toolbar">
<div class="col-lg-12">
<button type="button" class="btn btn-primary btn-save">Save</button>
<button type="button" id="btnCancel" class="btn btn-default btn-cancel">Cancel</button>
</div>
</div>

I have found the problem, below my listeners, there's an unrelated listener that I attached
$(document).on("click", "#btn-back", Views.Editor.close);
The problem here is that Views.Editor.close is the wrong method name.
When I changed the method name, the error disappears
I didn't realize that an unrelated listener can affect others

Ah. looks like you may have your JQuery params wrong if I've understood the question/ what you're trying to do.
DOM events should be appended to items on
html:
<div class="row">
<div class="col-lg-12">
<button id="save-btn-id" type="button" class="btn btn-primary btn-save">Save</button>
<button type="button" id="btnCancel" class="btn btn-default btn-cancel">Cancel</button>
</div>
</div>
js:
$(document).ready(function() {
$('#save-btn-id').click(function(evt) {
saveData(0);
});
});

From what I see at jQuery's API docs for their .off() function & in the code example above, it looks like the function isn't being passed as the 3rd parameter to the .off() function. So it's possible that the jQuery library is complaining that it can't find a function to remove it.
See: http://api.jquery.com/off/
Try this & see if it helps:
function clickListener(e){
saveData(0);
};
$toolbar.off('click', '.btn-save', clickListener);
$toolbar.on('click', '.btn-save', clickListener);

Try this: https://jsfiddle.net/jorge182/a1y9abcj/2/
toolbar = $("#toolbar")
$(toolbar).off('click', '.btn-save'); // $toolbar is assigned $("#toolbar") on init
$(toolbar).on('click', '.btn-save', function(e){
saveData();
});
function saveData(){
alert();
}

Executing Commands Javascript

I want to execute a command by the click of a button, and not when the page loads.
function hey() {
alert('bla');
}
Do I add something to the code above or to the button?
<input type="button" value="Click Me" onclick="hey()" />

Have you taken the time to type in your question into the magical Google box yet? Surely you'll see something like this:
<input type="button" value="Click me, now" onclick="hey()" />

Say you have the function that alerts a window to the user.
<script type="text/javascript">
function showMe() {
alert('You clicked on the button');
}
</script>
<button onclick="showMe()">Button</button>
This will make sure that the function is only called when the button is clicked upon and not when the page is loaded.

Okay, so you have a code that should work for alerting something on the click of a button. But you state that the code is running on page load. You have to check you code, looking for:
An onload attribute on the body tag, something like <body onload="hey()">
A call to hey somewhere else on your js code. Look for hey().
Maybe a reference to the button followed by a call to .click()
There is something else on your code causing the function to be called, you'll have to scan your code to find out what it is.