Using “if/else” with OnClick

Question

First of all, is it even possible to write if/else statements directly in html with onclick attribute? And if so, why is my code not working?

So this is a button. The "Calc.Input.value" refers to a text input and I want to display an error message if that field is 0 or blank. In all other cases I want some other things to happen as you can see. This is not relevant though, as everything after the "else" worked fine before.

<INPUT TYPE="button" NAME="drop" id="dropbutton" style="background-color:#D1E8D5;" VALUE="
Släpp ankare " OnClick="if ("Calc.Input.value == ''" || "Calc.Input.value == '0'")
{window.alert("Please enter a number");} else 
{document.getElementById('dropbutton').value=' Justera 
längd ';document.getElementById('length').innerHTML =
Calc.Input.value;document.getElementById('dropbutton').style.cssText = 'background-
color:#FFF6B3;';}">

Answer 1

Alert on nav page

           <script>
              function myFunction() {
            alert("You Are Not Signed In!");
                   }
                 </script>

Answer 2

The reason your code is not working is because you need to escape your " quotation marks, otherwise it will be interpreted as the HTML attribute symbol.

And I agree with the others, it is a bad practice to write your JavaScript inline inside your HTML.

Answer 3

Just DON'T put it in the onclick attribute.

Use

<INPUT TYPE="button" NAME="drop" id="dropbutton" style="background-color:#D1E8D5;" VALUE="Släpp ankare ">
<script>
document.getElementById('dropbutton').onclick = function() {
    if (Calc.Input.value == '' || Calc.Input.value == '0') {
         window.alert("Please enter a number");
    } else {
        document.getElementById('dropbutton').value=' Justera längd ';
        document.getElementById('length').innerHTML = Calc.Input.value;
        document.getElementById('dropbutton').style.backgroundColor = '#FFF6B3';
    }
    return false;
}
</script>

Answer 4

Hmm but how about for something like this:

<a href="#" onclick="if (a_function_to_get_language() == 'en') {
    alert('Some message');
}
else {
    alert('Some message in a different language');
}">Action</a>

Answer 5

sweetamylase's reply is best but you may also consider:

If your onclick= assignment is enclosed in double quotes (onclick="...") then try using only single quote characters inside of those double quotes (or vice versa).

This can make things easier when you need to make assignments to the onclick event when inserting elements dynamically and having separate script functions isn't really a good option.

Example:

<button onclick="alert('Do this'+' and that')">Press This</button>