JavaScript中的简单“选择”验证不起作用

Question

我坚持用javascript进行简单的“选择”验证。

问题是：验证“选择”时，验证错误后不向用户显示选择选项

“显示验证后，选择不会使用户重新选择选项”

HTML：

<div class="form-group">    

<label for="exampleInputArea">Area</label>
    <select style="color:#000 !important" class="form-control" id="exampleInputArea" placeholder="Select Month" name="exampleInputArea">
        <option value="" >--Select Area--</option>
        <option value="Area1">Area1</option>
        <option value="Area2">Area2</option>
        <option value="Area3">Area3</option>

    </select>
    <div style="color:red;" id="areaerror"></div>
</div>

<div class="form-group last">
    <button class="btn btn-lg btn-red mailbtn">Submit</button>
</div>

JS：

$('.mailbtn').live('click',function(){

area = $('#exampleInputArea').val();

if(area.lenght==0 || area=='')
        {
            $('#exampleInputArea').html('')
            $('#areaerror').text('Area is Required');
            return false;
        } else { 
            $('#areaerror').text('');
            return true;
        }

$.ajax({
        type: "POST",
        async : false,
        url: "mail.php",
        data: {area:area}
        })
        .done(function( msg ) {
        $('.mail_middle').html('');
        $('.mail_middle').html('We will call you to confirm your delivery address.<br/>Thank you.');
        return false;
        });
});

这是我的js小提琴链接： FIDDLE

请帮我解决问题，因为这浪费了我的时间。

Answer 1

将您的代码更改为以下代码， FIDDLE

if (area.length == 0 || area == '') {
    $('#exampleInputArea').val('')
    $('#areaerror').text('Area is Required');
    return false;
} else {
    $('#areaerror').text('');
}

您的错误

1. length不lenght
2. 出现错误时，请选择val('')而不是html('') ，通过val('')会将您的值选择为空白，这是您的默认值，而通过html('')它将替换您选择的html （即option ）空白。
3. 成功时不要返回它，因为您必须执行ajax功能，如果return true ，它将返回您未执行ajax功能的功能。

Answer 2

您的代码有一些错误：

$('.mailbtn').on('click',function(){    
    var area = $('#exampleInputArea').val();
    console.log(area);
    if(area.length==0 || area=='')
            {
                $('#areaerror').text('Area is Required');
                return false;
            } else { 
                $('#areaerror').text('');
                return true;
            }

所以最好使用我的代码，这是更新的小提琴：

http://jsfiddle.net/aelor/7zPgf/3/

仅当选择了任何区域时，这才发送ajax，否则它将仅显示验证消息

Answer 3

试试这个[http://jsfiddle.net/7zPgf/1/][1]直播不是一个好方法。 试一下。

 [1]: http://jsfiddle.net/7zPgf/1/