Question

HOWTO？

仅当一个或两个所需输入填充值时，才显示提交按钮但如果删除所需的值，则提交必须消失。

我应该用keyup来完成。任何想法？

Answer 1

以下功能可以帮助您：

$(function(){
    // Hide submit button if either field is empty
    $('form input').keyup(function(){
        if($('#input1').val() == "" || $('input2').val() == ""){
            $('#submit').hide();
        }
        else {
            $('#submit').show();
        }
    });
    // Don't submit form if either field is empty
    $('form').submit(function(){
    if($('#1').val() == "" || $('#2').val() == ""){
        return false;
    }
    });
});

顺便说一句，您最初需要使用CSS（display:none）隐藏提交按钮。

Answer 2

我建议在表单本身使用一个事件处理程序并检查所有必填字段。为了使它更具抽象性，如果你可以使用某些属性标记输入，那就太好了。示例解决方案如下：

    $('#formNode').keyup(function(e){
            var invalid = false;
            $(this).children().each(function(i,child){  
                if(($(child).attr("isReq") == "true") 
                    && child.value.length == 0
                ){
                    invalid = true;
                }   
            });
            $("#submitButton")[invalid ? "hide" : "show"]();
});   




    <form id="formNode">
            <input type="text" isReq="true"/>
        <input type="text" isReq="true"/>
        <input type="text" isReq="true"/>
        <input type="submit" value="Submit" style="display:none" id="submitButton"/>
    </form>

正如您所看到的，每次要检查节点时，您应该使用属性isReq标记它，脚本将为您完成工作。

Answer 3

在基本javascript中没有引用：

<input type="text" id="input-1" onkeyup="submitChange();" />

<input type="text" id="input-2" onkeyup="submitChange();" />

<input type="submit" id="submit" style="display: none;" />

<script type="text/javascript">

inputOne = document.getElementById("input-1"); 
inputTwo = document.getElementById("input-2"); 
inputSubmit = document.getElementById("submit"); 

function submitChange()
{
     if(inputOne.value == "" || inputTwo.value == "")
     {
          inputSubmit.style.display = "none";
     }
     else
     {
          inputSubmit.style.display = "block";
     }
}

</script>

Answer 4

$('#inputid').keyup(function() {
    if ($(this).val().length > 0) {
       $('#submitbutton').show();
    } else {
       $('#submitbutton').hide();
    }
});

for multiple：

$('#inputid1,#inputid2, etc...').keyup(function() {
   var hidden = false;
   $('#inputid1,#inputid2, etc...').each(function() {
      if ($(this).val().length == 0) {
          hidden = true;
      }
   })
   if (hidden) {
      $('#submitbutton').hide();
   } else {
      $('#submitbutton').show();
   }

}）;

Answer 5

为什么不看看onblur。

onblur Event

onblur事件发生在一个对象上失去焦点。

显示/隐藏提交按钮

5 个答案: