admin管理员组

文章数量:1253085

I am very new to JavaScript, and trying to run a simple script which gives my field a red border if it is incorrectly pleted (i.e. if the entry is not a number), but then turns the border colour green if the field is then correctly pleted, but the form cannot be submitted because a different field has been filled out incorrectly.

So far i have managed to do this for a text field by using this:

function validateForm()
{
var x=document.forms["myForm"]["FN"].value;
if (x==null || x=="")
  {
  alert("First name must be pleted");
  document.forms["myForm"]["FN"].style.border="1px solid red";
  return false;
  }
  else (x!==null || x!=="")
  {
  document.forms["myForm"]["FN"].style.border="1px solid green";
  }

but I am now trying to do the same thing but limit the field to only accept numbers. What I have so far is this:

var x=document.forms["myForm"]["mobile"].value;
if (isNaN(x) || x==null || x=="")
  {
  alert("Contact number must be pleted with numbers only");
  document.forms["myForm"]["mobile"].style.border="1px solid red";
  return false;
  }
  else (x!==null || x!=="" || // need to write here is not isNaN !isNaN//)
  {
  document.forms["myForm"]["SN"].style.border="1px solid green";
  }

This restricts the fie;ld to only allowing numbers, but once the form box border turns red, it will not turn to green once the validation has been met.

Any help/tips on how to write is not isNaN, or any work arounds would be appreciated.

Please try to keep as simple as poss, as am a plete beginner with web design & JavaScript.

Thanks!

I am very new to JavaScript, and trying to run a simple script which gives my field a red border if it is incorrectly pleted (i.e. if the entry is not a number), but then turns the border colour green if the field is then correctly pleted, but the form cannot be submitted because a different field has been filled out incorrectly.

So far i have managed to do this for a text field by using this:

function validateForm()
{
var x=document.forms["myForm"]["FN"].value;
if (x==null || x=="")
  {
  alert("First name must be pleted");
  document.forms["myForm"]["FN"].style.border="1px solid red";
  return false;
  }
  else (x!==null || x!=="")
  {
  document.forms["myForm"]["FN"].style.border="1px solid green";
  }

but I am now trying to do the same thing but limit the field to only accept numbers. What I have so far is this:

var x=document.forms["myForm"]["mobile"].value;
if (isNaN(x) || x==null || x=="")
  {
  alert("Contact number must be pleted with numbers only");
  document.forms["myForm"]["mobile"].style.border="1px solid red";
  return false;
  }
  else (x!==null || x!=="" || // need to write here is not isNaN !isNaN//)
  {
  document.forms["myForm"]["SN"].style.border="1px solid green";
  }

This restricts the fie;ld to only allowing numbers, but once the form box border turns red, it will not turn to green once the validation has been met.

Any help/tips on how to write is not isNaN, or any work arounds would be appreciated.

Please try to keep as simple as poss, as am a plete beginner with web design & JavaScript.

Thanks!

Share Improve this question asked Jan 11, 2014 at 22:01 cj69cj69 1131 gold badge1 silver badge4 bronze badges 8
  • 10 The opposite of isNaN is !isNaN, reads like: "isn't not a number" therefore, it's a number. – elclanrs Commented Jan 11, 2014 at 22:01
  • 1 Why don't you just use an else clause that makes no further tests? That would result in code running when the not-a-number test fails, which means it must be a number. – Pointy Commented Jan 11, 2014 at 22:12
  • @Pointy: how can an else clause make a test? – Qantas 94 Heavy Commented Jan 11, 2014 at 22:13
  • Yeah, that syntax is not right now that I notice... – elclanrs Commented Jan 11, 2014 at 22:14
  • i managed to get this working using else (x>=0 || x!==null || x!==""), but as this is a contact number, it should allow space breaks in between the numbers (i.e. 0800 123 456 rather than 0800123456). Any ideas how to get around this issue? – cj69 Commented Jan 11, 2014 at 22:58
 |  Show 3 more ments

3 Answers 3

Reset to default 8

The literal opposite of isNaN(num) is !isNaN(num). However, this won't always verify that something is numeric. To check if something is numeric, use jQuery's $.isNumeric(num), or this

function isNumeric(num) {
  return !isNaN(parseFloat(num)) && isFinite(num);
}

If your code really looks like this:

  else (x>=0 || x!==null || x!=="")
  {
    document.forms["myForm"]["SN"].style.border="1px solid green";
  }

then your problem really has nothing to do with isNaN. Syntactically, your else clause only applies to that parenthesized test expression. That expression will be evaluated when the if clause is false. It will have no effect on anything, however; the value will just be thrown away. The subsequent block statement in which the border is made green will always be executed; it has nothing to do with the if - else statement.

The syntax for the else clause in JavaScript does not involve a test condition like the if clause does. After an else should e a statement. In your case, that "statement" is the parenthesized test expression, which while useless is a perfectly valid statement in JavaScript.

Since ECMAScript 2015 use Number.isFinite to check if a value is a number. You may need to call parseInt or parseFloat before that if your value is of a string type.

For example let isNumber = Number.isFinite(parseInt(my_form_input.value));

The polyfill for older browsers is

Number.isFinite = Number.isFinite || function(value) {
  return typeof value === 'number' && isFinite(value);
}

本文标签: formsJavaScriptWhat is the opposite of isNaNStack Overflow