簡體   English   中英

如果使用jQuery提交時textarea為空,如何禁用提交按鈕

[英]How to disabled a submit button if textarea is empty on submit with jquery

應該有一種無需使用插件即可驗證此textarea的簡單方法,它一直在嘗試檢查textarea是否為空或具有空值,但是我無法完成這項工作。 我有一個http://jsfiddle.net/creativestudio/f3qQ5/

希望有人可以幫忙。

這是我的html:

<div class="post-container">
    <form class="reply-form">
        <div class="reply-box">
            <textarea placeholder="Reply box 1..." columns="10" rows="1" name="comment-input"></textarea>
            <input type="submit" value="Send">
        </div>
        <div class="post-dropdown"></div>
        <div class="post-dropdown-content">
            <div class="post-dropdown-reply">1</div>
        </div>
    </form>
</div>

<div class="post-container">
    <form class="reply-form">
        <div class="reply-box">
            <textarea placeholder="Reply box 2..." columns="10" rows="1" name="comment-input"></textarea>
            <input type="submit" value="Send">
        </div>
        <div class="post-dropdown"></div>
        <div class="post-dropdown-content">
            <div class="post-dropdown-reply hidden">1</div>
        </div>
    </form>
</div>

        ​

這是我的Js:

function gettingReplyVal() {
    $('.reply-form').submit(function(e) {
        var textAreaValue = $(this).find('textarea').val();
        post = $("<div>").addClass("post-dropdown-reply");
        post.html(textAreaValue);
        $(this).find('.post-dropdown-content').prepend(post);
        e.preventDefault();
        $('textarea').val('');
    });
}

gettingReplyVal();​

如果要禁用為空的提交按鈕,可以使用事件keyup():

$('textarea[name=comment-input]').keyup(function(e){
    $(this).parent().find("#submit").attr("disabled", true);
    val = $(this).val().trim();    
    if(val.length > 0){
        $(this).parent().find("#submit").attr("disabled", false);
    }
});

在此處查看演示http://jsfiddle.net/aanred/NpvsF/

$('.reply-form').submit(function(e) {
  if($(this).find('textarea').val().trim() == '')
    return false;
  //submit code here
}

您可以只使用.val(),但是我添加了trim()只是為了補償空間。

試試這個驗證

if($(this).find('textarea').val()=='')
  return false;

嘗試以下jquery腳本:

if($('textarea[name=comment-input]').val().trim()==''){
   $("#submit").attr("disabled", true);  
}

$('textarea[name=comment-input]').keyup(function(){
    $("#submit").attr("disabled", true);
    val = $(this).val().trim();    
    if(val.length > 0){
        $("#submit").attr("disabled", false);
    }
});

它對我的工作。 希望它也對您有用。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM