Develop Reference

Navigate to route on button click

When I click on the following button, I would like to be redirected to the route specified in the href. However it doesn't work:
<button href="/auth"> Google+ </button>
I am not sure if it matters but I am running a node app.
How can I navigate to a route on button click?

Buttons were not initially designed for the purpose of redirecting to a new page. Instead, what you are looking for is the a tag. From reading the comments, however, it is clear that you would like to keep the button element and add the same functionality for redirecting without the use of JavaScript, so I will provide a couple of solutions:
With JavaScript
var button = document.getElementById('myButton');
button.onclick = function() {
location.assign('https://stackoverflow.com/questions/52229901/navigate-to-route-on-button-click/');
}
<button id="myButton">Visit Website</button>
Without JavaScript
<form action="https://stackoverflow.com/questions/52229901/navigate-to-route-on-button-click/">
<input type="submit" value="Visit Website"/>
</form>

You can use the following solution to navigate to the route on a button click:
<button onclick="clickFun()"> Google+ </button>
<script>
clickFun() {
window.location = '/auth';
}
</script>

Buttons need an onClick handler. The href attribute is for links (anchor tags, more specifically).
<button onClick='someFunction'>Google</button>
<script>
someFunction() {
window.location = 'some-url';
}
</script>

You can use an a element instead:
Google+

The best way to rout some different page: we have native javascript method
location.asign('here your link');
For example
var btn = document.getElementById('btn');
btn.onclick = function() {
location.assign('https://stackoverflow.com/questions/52229901/navigate-to-route-on-button-click');
}
<button id="btn">
click
</button>

Its very simple you can't use link inside the button tag but you can add tag outside the button tag
for example
<a href='www.google.com'><button>Click me</button></a>
rest depends on your css skills

You can put the link inside the button and give the link href property , style the href class as per need
<button class="button is-success" onclick={submit}>
<a href="/auth" class="href">
Save changes and Submit
</a>
</button>

You can nest your button inside the anchor tag
<a href="/auth">
<button> Google+ </button>
</a>

javascript click a button using a script

I would like to click a button using javascript without physically clicking on the bottom.
Below is what I have tried:
<li id="#attendBtn"><a style="background:#FF6400;" href="#attend"><i class="fa fa-check"></i> Attend</a></li>
echo "<script>
document.getElementById('attendBtn').click();
</script>";
but it does not seem to work. any help would be appreciated

Remove the # in <li id="#attendBtn">.
document.getElementById('attendBtn').click();
<li id="attendBtn" onclick="console.log(1);"><a style="background:#FF6400;" href="#attend"><i class="fa fa-check"></i> Attend</a></li>
In javascript, if you use getElementById, you only need to pass the id name. Other frameworks such as jQuery use the # as an alias to id

document.getElementById('attendBtn').onclick();

If I understand your question correctly, you want to trigger the click event without actually having to click on the button?
You should look into using jQuery for that then.
Then you can do this:
$('#attendBtn').click(function() {
console.log('button was clicked');
});
And trigger it with this:
$('#attendBtn').trigger('click');
Also, I'm guessing the rest of the html is not posted, as an 'li' should be in a 'ul'?

Bootstrap open Modal AND Hyperlink

I am looking for a way to open a modal as well as the underlying hyperlink.
So if my code looks like this:
<a class="btn pull-right" target="_blank" href="http://www.example.com" data-toggle="modal" data-target="#modal_div" data-remote="false">something</a>
I want to open the Modal as well as the link to "www.example.com"...
Does anybody have an idea of how to accomplish this?
Thanks for your advice!

You should define the .click handler for your link, remove data- attributes and toggle .modal() with javascript.
I think that bootstrap handler for clicking on anchors with data- attributes for modals and other plugins uses preventDefault(), that is why you just can't use href="http://www.example.com".
FIDDLE DEMO

Can I make a link point to a javascript function?

My code is:
<input class="button" type="button" value="Mark" onClick="doCheck('mark');" \>
I want to make it using an
<a>
link. Is it possible to do this? I only know how linking to another page.

Use Like that
<a class="button" href="javascript:void(0)" onClick="doCheck('mark');" >Mark</a>
or this way
<a class="button" href="javascript:doCheck('mark')" >Mark</a>

< a href='javascript:void(null);' onclick='doCheck()' > Test </a>

<a onClick="doCheck('mark');"> Mark </a>
You can attach click handlers to any DOM element that is visible on the page. I would seperately recommend seperation of markup and javascript.
So something like.
<a id="mark">
...
<script type="text/javascript">
$(function() {
$("#mark").click(function() {
doCheck("mark");
});
});
</script>
Would be preferable. In this case $ is jQuery. A pure javascript solution is possible but that has a lot of boilerplate code that hides the point.

You can use the onClick attribute on any html element. So use it in your a tag or in your img tag.

This code example will execute the JavaScript without following the link:
Mark
If you want to follow the link, drop the return false; part:
Mark

inline javascript in href

How can you do something like this:
<a href="some javascript statement that isn't a function call;" >myLink</a>
And have the js in the href execute when the link is clicked.

Just put the JS code directly in there:
fsljk
Though, you should not be doing inline scripting. You should unobtrusively attach event handlers.
<a id="lol" href="/blah">fdsj</a>
<script>
document.getElementById('lol').onclick=function() {
/* code */
};
</script>

<a href="javascript:var hi = 3;" >myLink</a>
Now you can use hi anywhere to get 3.

You can write inline-code in the same way as
<a href="javascript:[code]">
This method is also available in other tags.
addition
if you want to Execution when something tag clicking, you can fix with onClick attribute
<a onClick="function()">

I know this question is old but I had a similar challenge dynamically modifying the href attribute that sends an email when the anchor tag is clicked.
The solution I came up with is this:
$('#mailLink,#loginMailLink,#sbMailLink').click(function () {
this.setAttribute('href', "mailto:" + sessionStorage.administrator_mail_address + "?subject=CACS GNS Portal - Comments or Request For Access&body=Hi");
});
<a id="loginMailLink" href= "#" style="color:blue">CACS GNS Site Admin.</a>
I hope that helps.