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='../../';
});

Click button in webpage with Javascript

Currently, I'm doing an application and I need login to this one particular website. Basically, I need to make this button click using a javascript but I have no idea how to.
This is the button code I retrieved from the website:
<button type="submit" class="uk-width-1-1 uk-button uk-button-primary uk-button-large">Sign in</button>
Thank you for your help in advance

You can click on the button programmatically, in case of pure javascript :
(function(){document.querySelector('button[type="submit"]').click();})()
In case of Android JS Interface :
webView.loadUrl("javascript:(function(){"+
"l=document.querySelector('button[type=\"submit\"]');"+
"e=document.createEvent('HTMLEvents');"+
"e.initEvent('click',true,true);"+
"l.dispatchEvent(e);"+
"})()");

The general way to have button click events is to use something like jQuery. For example lets set the button to have an ID
<button id="my-button" type="submit" class="uk-width-1-1 uk-button uk-button primary uk-button-large">Sign in</button>
Then we would apply a click event to it with jQuery
$('#my-button').click(function(){alert('button has been clicked');})
Instead of the alert you could put whatever code you want in there :D
Example: Codepen example
EDIT: Example for a class:
Example for a class
(Note that we use a "." instead of "#" in the call)
-Kyle

How to pass this key word outside of onclick function in javascript

I need one help. I am passing this key word inside the onclick function. if user need to call the same function without using the onclick event how it will be called using javascript.I am explaining the scenario below.
<input name="optional_0_0_ans" id="optional_0_0_ans" class="form-control firstsec" placeholder="Answer" value="" type="text"> <button type="button" class="btn btn-sm btn-success" style="line-height:12px;" onclick="createNew(this,0,0,1);"><i class="fa fa-plus" aria-hidden="true"></i></button>
<script>
function createNew(evt,index,childindex,hidevalue){
}
</script>
On the above code i am passing the this keyword inside the onclick event.Here suppose user wants to call the createNew function some where else and wants to pass the same this key word then how it will be done.Please help me.

Here suppose user wants to call the createNew function some where else and wants to pass the same this key word then how it will be done.
That's not possible since this only exists inside the event handler. The "same this" doesn't exist outside of the handler.
I guess what you mean is that they want to pass the same or a similar value. So what is the value of this? It's a DOM element. They just need to get a reference to a DOM element and pass that:
var someElement = // get reference to a DOM element
createNew(someElement,0,0,1);

Inside the onclick attribute this refers to the current DOM Element. So if you want to achieve the same behavior, you can simply get and parse the DOM Element yourself:
var button = document.querySelector('#optional_0_0_ans button');
createNew(button, 0, 0, 3);

You can do it using below code:
$(".btn-success").on("click", function(){
someFunction(this, param1, param2,...)
})
Where ".btn-success" is a class assigned to button on which click you want to call a JavaScript function. You can also use id in selector.

Yes you can ,add id to your element will be more easy to handle ...
I added id to your button element to illustrate
<button type="button" class="btn btn-sm btn-success" id="btn" style="line-height:12px;" onclick="createNew(this,0,0,1);"><i class="fa fa-plus" aria-hidden="true"></i></button>
<script>
function createNew(evt,index,childindex,hidevalue){
alert(evt.type); //alert button when click
}
createNew(document.getElementById('btn'),4,5,4); //alert button when run
</script>

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();
}

how to click a button using jQuery?

Here is the DOM :
<div class="form-actions">
<button class="btn btn-primary" type="submit">Save device</button>
</div>
I want to use Jquery to select the button and click on it?
I tried using : jQuery(".btn btn-primary").click()
which is not working

You are trying to select an element with both classes, therefore your selector should be .btn.btn-primary.
$('.btn.btn-primary').click();
You were trying to select a element with class .btn-primary that was a descendant of a .btn element.

Your selector is incorrect; because both classes are on the same element you need to separate them by . with no spaces:
jQuery(".btn.btn-primary").click()

You could use the jQuery trigger() method to trigger the behaviour of an existing event handler.
https://api.jquery.com/trigger/
example:
<button id='testButton'>Test</button>
<script>
$(function(){
$('#testButton').on('click' , function(){
alert("I've been clicked!");
});
//now on another event, in this case window resize, you could trigger
//the behaviour of clicking the testButton?
$( window ).resize(function() {
$('#testButton').trigger( "click" );
});
});
</script>

See the following:
https://api.jquery.com/trigger/
Use $(".btn-primary").trigger("click");
Hope that helps

Just incase you did not learn yet, you can always define an Id for the button and use it this way:
<div class="form-actions">
<button id="mybutton" class="btn btn-primary" type="submit">Save device</button>
</div>
$('#mybutton').click(function(){
//your code goes here
});

$( window ).load(function() {
$(".btn-primary").trigger('click');
});