Question

我在这个帖子创建者工作，默认情况下禁用主按钮开始，一旦用户写入文本，它就会被启用并且可以发送表单......

问题

现在我想添加一个可选的民意调查......这个民意调查有两个文本字段来验证它是否仅显示....

单击Add Poll时，主窗体按钮将变为禁用状态，这两个文本字段将成为必填字段。如果决定删除民意调查，则不再需要这两个文本字段....只有主文本字段中有文本时才会重新启用主按钮

因此，有两个选项可以重新启用主按钮：

1）在没有民意调查的情况下在主要文本区写文本

2）在主要textarea中写入文本，添加带有两个textfieds的民意调查。

$("#Add").on("click",function(){	


$("#pollContainer").show();
$("#SendButton").prop("disabled",true);
});

$("#Delete").on("click",function(){	

 $("#pollContainer input").val("");
$("#pollContainer").hide();
$("#SendButton").prop("disabled",false);
});

//starting
$("#SendButton").prop("disabled",true);

$("#maintext").on("input",function(){	

if($("#maintext").val().length==0){
$("#SendButton").prop("disabled",true);
}else{
$("#SendButton").prop("disabled",false);
}


});

#pollContainer{display:none;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>


<textarea id="maintext"></textarea>
   

    <button id="Add">Add New Poll</button> <button id="Delete">delete Poll</button>
    
    <div id="pollContainer">
    <input type=text id="first_entry" /><br/>
    <input type=text id="second_entry" />
    </div>
    
    <hr/>
    
    <input type=submit value="Send" id="SendButton" />

Answer 1

 $("#Add").on("click", function() {


     $("#pollContainer").show();
     $("#SendButton").prop("disabled", true);
 });

 $("#Delete").on("click", function() {

     $("#pollContainer input").val("");
     $("#pollContainer").hide();
     $("#SendButton").prop("disabled", false);
 });

 //starting
 $("#SendButton").prop("disabled", true);

 $("input, #maintext").keyup(function() {
     if ($("#maintext").val().length == 0) {
         $("#SendButton").prop("disabled", true);
     } else {
         if ($("#pollContainer").is(":visible")) {
             var valStatus = false;
             $("#pollContainer input").each(function() {
                 var input = $(this);
                 if (!input.val() && !input.val().trim().length > 0)
                     valStatus = !valStatus ? true : false;
             });
             $("#SendButton").prop("disabled", valStatus);
         } else {
             $("#SendButton").prop("disabled", false);
         }

     }


 });

#pollContainer{display:none;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>


<textarea id="maintext"></textarea>


<button id="Add">Add New Poll</button> <button id="Delete">delete Poll</button>

<div id="pollContainer">
    <input type=text id="first_entry" /><br/>
    <input type=text id="second_entry" />
</div>

<hr/>

<input type=submit value="Send" id="SendButton" />

Answer 2

因此，您需要在更改时检查轮询输入的值，并根据轮询容器是否可见来有选择地启用和禁用该按钮

＆＃13;

$("#Add").on("click", function() {
    $("#pollContainer").show();
    $("#SendButton").prop("disabled",true);
});

$("#Delete").on("click", function() {
    $("#pollContainer input").val("");
    $("#pollContainer").hide();

    if(should_enable_button()) {
        $("#SendButton").prop("disabled",false);
    }
});

//starting
$("#SendButton").prop("disabled",true);

$("#maintext, #first_entry, #second_entry").on("input", function() {
    if(should_enable_button()) {
        $("#SendButton").prop("disabled", false);
    }
    else {
        $("#SendButton").prop("disabled", true);
    }
});

function should_enable_button() {
    var shouldEnable = false;

    if($("#maintext").val().length > 0)
    {
        if($("#pollContainer").is(":visible")) {
            if($("#first_entry").val().length > 0 && $("#second_entry").val().length > 0) {
                shouldEnable = true;
            }
        }
        else {
            shouldEnable = true;
        }
    }

    return shouldEnable;
}

＆＃13;

#pollContainer{display:none;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>


<textarea id="maintext"></textarea>


<button id="Add">Add New Poll</button> <button id="Delete">delete Poll</button>

<div id="pollContainer">
	<input type=text id="first_entry" /><br/>
	<input type=text id="second_entry" />
</div>

<hr/>

<input type=submit value="Send" id="SendButton" />

＆＃13;

禁用主按钮验证新字段片段Jquery

2 个答案: