用于验证输入中输入的最小单词的JavaScript脚本

时间:2022-11-29 17:29:13

I really don't know how to do this. So I need a JavaScript script that'd look at the contact form field (question name) and make sure it has more than one word before submitting it.

我真的不知道该怎么做。所以我需要一个JavaScript脚本来查看联系表单字段(问题名称)并确保它在提交之前有多个单词。

<input type="text" name="question[name]" id="question_name">

I really searched a lot, found some solutions but non of them really worked.

我真的搜索了很多,发现了一些解决方案,但没有真的有效。

Can you help me?

你可以帮我吗?

2 个解决方案

#1


1  

<input type="text" name="question[name]" id="question_name" onblur="this.value.split(' ').length < 2 ? alert('you need more words here') : '';" />

jsfiddle

的jsfiddle


Edit to improve it:

编辑以改进它:

HTML code:

HTML代码:

<p>
    <input type="text" name="question[name]" id="question_name" onblur="CheckErrors.Name(this);" />
    <span class="error"></span>
</p>

JS code:

JS代码:

var CheckErrors = {

    Config: {
        Error_Strings: {
            Name: 'you need more words here',
            Email: 'the email looks invalid'
            //, ....
        }
    },

    Name: function(element){
        try{
            var error_target = element.nextElementSibling;
            if( element.value.split(' ').length < 2 ){
                error_target.textContent = this.Config.Error_Strings.Name;
            }
            else{
                error_target.textContent = '';
            }
        }
        catch(e){
            console.log(e.stack);
        }
    }

    //, Email: function(element){}....
};

#2


2  

Here a fiddle http://jsfiddle.net/6q8jJ/4/

这里有一个小提琴http://jsfiddle.net/6q8jJ/4/

html

HTML

<input type="text" name="question[name]" id="question_name">
<button onclick="validate();">send</button>

js

JS

function validate(){

    var error = 0,
    el = document.getElementById("question_name");

    if(el.value.replace(/\s+/g, '').length <= 1){ //get value, remove all whitespace, get length
        error++;
    }

    /*
    * etc
    * your other validation
    */


   if(error > 0) {
       alert('mhh...');
   }else{
       alert('ok send for real');
   }

}

#1


1  

<input type="text" name="question[name]" id="question_name" onblur="this.value.split(' ').length < 2 ? alert('you need more words here') : '';" />

jsfiddle

的jsfiddle


Edit to improve it:

编辑以改进它:

HTML code:

HTML代码:

<p>
    <input type="text" name="question[name]" id="question_name" onblur="CheckErrors.Name(this);" />
    <span class="error"></span>
</p>

JS code:

JS代码:

var CheckErrors = {

    Config: {
        Error_Strings: {
            Name: 'you need more words here',
            Email: 'the email looks invalid'
            //, ....
        }
    },

    Name: function(element){
        try{
            var error_target = element.nextElementSibling;
            if( element.value.split(' ').length < 2 ){
                error_target.textContent = this.Config.Error_Strings.Name;
            }
            else{
                error_target.textContent = '';
            }
        }
        catch(e){
            console.log(e.stack);
        }
    }

    //, Email: function(element){}....
};

#2


2  

Here a fiddle http://jsfiddle.net/6q8jJ/4/

这里有一个小提琴http://jsfiddle.net/6q8jJ/4/

html

HTML

<input type="text" name="question[name]" id="question_name">
<button onclick="validate();">send</button>

js

JS

function validate(){

    var error = 0,
    el = document.getElementById("question_name");

    if(el.value.replace(/\s+/g, '').length <= 1){ //get value, remove all whitespace, get length
        error++;
    }

    /*
    * etc
    * your other validation
    */


   if(error > 0) {
       alert('mhh...');
   }else{
       alert('ok send for real');
   }

}