【问题标题】:My validation doesn't work for textarea我的验证不适用于 textarea
【发布时间】:2014-10-10 13:49:39
【问题描述】:

如何检查textarea是否为空并在span中显示这句话:“you shoud fill textbox”?

<textarea class="form-control"id="txtarea" rows="4"></textarea>

<span id="textspan" style="color:red"></span>

<script>               
    var textspan = document.getElementById('textspan');

    if($("#txtarea").val().length < 1)
    {
        $("#textspan").html('you shoud fill text area');
    }
</script>

【问题讨论】:

  • 使用var isEmpty = $.trim(textAreaValue).length;

标签: javascript jquery twitter-bootstrap validation


【解决方案1】:

您似乎没有输入完整的代码,并且我看不到向您显示错误的结构,何时必须显示此错误? 但是,如果您有一个按钮,并且希望在提交空文本区域时显示此错误并在用户输入输入时删除错误,请尝试以下操作:

var textspan = document.getElementById('textspan');
$('#txtarea').bind('input propertychange', function() { 
    if($("#txtarea").val().trim().length > 0){
        $("#textspan").html('');
    }
});

$("#Button1").click(function(){
    if($("#txtarea").val().trim().length < 1){
        $("#textspan").html('you shoud fill text area');
    }
});

你可以看到,如果用户尝试提交一个 empaty textarea,就会得到错误,当向 textarea 添加任何字符时,错误就会消失。

Check JSFiddle Demo

【讨论】:

  • tnx 很多,它在我的一个程序中工作,但在另一个程序中不起作用,消息变成闪烁。它变成了刷新。你能帮帮我吗?
  • 你能创建一个 JSFiddle 并模拟你的问题吗?提供的这几个细节无法为您提供帮助。
  • {"error": "Shell form 不验证{'html_initial_name': u'initial-js_lib', 'form': , 'html_name': 'js_lib', 'html_initial_id': u'initial-id_js_lib', 'label': u'Js lib', 'field': , 'help_text': '', ' name': 'js_lib'}{'html_initial_name': u'initial-js_wrap', 'form': }
【解决方案2】:

textareas 中,空白不被修剪,所以

<textarea> </textarea>

已经有一个val(),它是一个长度为1且(一个空格)的字符串

示例:http://jsfiddle.net/4bb2h84n/

话虽如此,您需要做的就是修剪值:

if($('#txtarea').val().trim().length < 1) { /* logic here */ }

【讨论】:

    【解决方案3】:

    这是一个有效的答案 (JsFiddle):

    var updateWarning = function() {
        var inputEmpty = $("#textarea").val().trim().length == 0;
        if (inputEmpty) {
            $("#textspan").html('you shoud fill text area');
        }
        else {
            $("#textspan").html('');
        }
    }
    
    $("#textarea").keyup(updateWarning);
    updateWarning();
    

    请注意,有很多表单验证库可以帮助您解决此问题。

    【讨论】:

      【解决方案4】:

      这段代码看起来不错。当用户尝试提交时,您只需用函数包装它并在验证事件中调用此函数。

      function validation(){
          if($("#txtarea").val().length < 1)
          {
              $("#textspan").html('you shoud fill text area');
          }}
      

      【讨论】:

        猜你喜欢
        • 2015-03-27
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2011-05-18
        • 2011-01-16
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多