表单验证null或空格不起作用

时间:2016-02-01 15:32:06

标签: javascript html

我正在尝试创建一个表单,到目前为止一直很好,除非验证没有点亮,因为我故意让它空白或放置空格。我在HTML中添加了“required”,它完成了我想要它的一部分。 这是javascript函数:

using System.Text;
using System.Text.RegularExpressions;

namespace HQ.Util.General
{
    /*
        Usage:

           _glob = new FilterGlob(filterExpression, _caseSensitive);            


            public bool IsMatch(string s)
            {
                return _glob.IsMatch(s);
            }
    */


    /// <summary>
    /// Glob stand for: Pattern matching. Supported character are "?" and "*".
    /// </summary>
    public class FilterGlob
    {
        private readonly Regex pattern;

        /// <summary>
        /// Constructs a new <see cref="T:Microsoft.Practices.Unity.InterceptionExtension.Glob"/> instance that matches the given pattern.
        /// 
        /// </summary>
        /// <param name="pattern">The pattern to use. See <see cref="T:Microsoft.Practices.Unity.InterceptionExtension.Glob"/> summary for
        ///             details of the patterns supported.</param><param name="caseSensitive">If true, perform a case sensitive match.
        ///             If false, perform a case insensitive comparison.</param>
        public FilterGlob(string pattern, bool caseSensitive = true)
        {
            this.pattern = FilterGlob.GlobPatternToRegex(pattern, caseSensitive);
        }

        /// <summary>
        /// Checks to see if the given string matches the pattern.
        /// 
        /// </summary>
        /// <param name="s">String to check.</param>
        /// <returns>
        /// True if it matches, false if it doesn't.
        /// </returns>
        public bool IsMatch(string s)
        {
            return this.pattern.IsMatch(s);
        }

        private static Regex GlobPatternToRegex(string pattern, bool caseSensitive)
        {
            StringBuilder stringBuilder = new StringBuilder(pattern);
            string[] strArray = new string[9]
            {
                "\\",
                ".",
                "$",
                "^",
                "{",
                "(",
                "|",
                ")",
                "+"
            };

            foreach (string oldValue in strArray)
            {
                stringBuilder.Replace(oldValue, "\\" + oldValue);
            }

            stringBuilder.Replace("*", ".*");
            stringBuilder.Replace("?", ".");
            stringBuilder.Insert(0, "^");
            stringBuilder.Append("$");

            RegexOptions options = caseSensitive ? RegexOptions.None : RegexOptions.IgnoreCase;

            return new Regex(((object)stringBuilder).ToString(), options);
        }

    }
}

这是HTML

    function validateForm() {
var x = document.forms["form"]["fname"].value;
var a = document.forms["form"]["lname"].value;
var b = document.forms["form"]["abbr"].value;
var c = document.forms["form"]["city"].value;
var d = document.forms["form"]["prov"].value;
var e = document.forms["form"]["postal"].value;
var f = document.forms["form"]["phoneNum"].value;
var g = document.forms["form"]["cellphone"].value;
var h = document.forms["form"]["email"].value;
var i = document.forms["form"]["dob"].value;

if (x == null || x == " ") {
    document.getElementById("hidestar").hidden=false;
    if (a == null || a == "") {
        document.getElementById("hidelast").hidden=false;
            if (b == null || b == "") {
                document.getElementById("hideaddr").hidden=false;
                if (c == null || c == "") {
                    document.getElementById("hidecity").hidden=false;
                        if (c == null || c == "") {
                            document.getElementById("hidecity").hidden=false;
                                if (d == null || d == "") {
                                    document.getElementById("hideprov").hidden=false;
                                        if (e == null || e == "") {
                                            document.getElementById("hidepost").hidden=false;
                                                if (f == null || f == "") {
                                                    document.getElementById("hidephone").hidden=false;
                                                        if (g == null || g == "") {
                                                            document.getElementById("hidecell").hidden=false;
                                                            if (h == null || h == "") {
                                                                document.getElementById("hideemail").hidden=false;
                                                                    if (i == null || i == "") {
                                                                        document.getElementById("hidedob").hidden=false;

                                                                    }
                                                                }
                                                            }
                                                }
                                        }
                                }
                        }
                }

    }
    return false;
    }          

2 个答案:

答案 0 :(得分:0)

我快速举例说明了代码的外观。

https://jsfiddle.net/8kn2hgtz/

- formatted your html
- the asteriks is now css
- the validation is annotation is way simpler

它可以改进和扩展,jQuery也会为你提供一些似乎简化某些任务的方法,...
但对于第一印象,我决定留下一些简单的代码(纯html,js和css)

您的代码不包含一些真正的验证;所以我也没有实施 在谷歌或StackOverflow上搜索一些图书馆,让您的生活变得简单。

答案 1 :(得分:0)

使用你已经获得的代码,你应该取消所有if语句的嵌套,以便它们都被执行。

然后,你应该跟踪整体结果 - 你可能会混淆ANDOR,但最简单的是有一个布尔值随着你的进行修改,例如

var isValid = true;
if (x == null || x == " ") {
 document.getElementById("hidestar").hidden=false;
 isValid = false;
}
if (a == null || a == "") {
    document.getElementById("hidelast").hidden=false;
 isValid = false;
}
if (b == null || b == "") {
 document.getElementById("hideaddr").hidden=false;
 isValid = false;
}
...

依此类推,直到您只需返回isValid