Question

我需要提交按钮才能激活所有字段并填充/选择。

我看了几个例子，但不知道怎么做!!

＆＃13;

$(document).ready(function()
{
	$('.envia').prop('disabled',true);
	$('#matricula').on('change', function () 
	{
		$('#envia').prop('disabled', !$(this).val());
		
	}).trigger('change');
});

$(document).ready(function()
{
	$('.envia').prop('disabled',true);
	$('#peca').on('change', function () 
	{
		$('#envia').prop('disabled', !$(this).val());
		
	}).trigger('change');
});

$(document).ready(function()
{
	$('.envia').prop('disabled',true);
	$('#quilometros').keyup(function()
	{
		$('#envia').prop('disabled', !$(this).val());
	}).trigger('change');
});

$(document).ready(function()
{
	$('.envia').prop('disabled',true);
	$('#data').keyup(function()
	{
		$('#envia').prop('disabled', !$(this).val());
	}).trigger('change');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<form action="#">
<select id="matricula">
    <option></option>
    <option value="1">Matricula 1</option>
    <option value="2">Matricula 2</option>

</select>
<select id="peca">
    <option></option>
    <option value="1">Peca 1</option>
    <option value="2">Peca 2</option>

</select>
<input type="text" id="quilometros">
<input type="text" id="data">



<input type="submit" id = "envia" value="ok"></input>
</form>

＆＃13;

Answer 1

您遇到的问题是您是根据各个字段设置禁用的，而不检查所有其他字段的状态。

你可以为所有人使用一个事件处理程序，但每次都需要检查所有控件

$(function(){
    // pseudo selector `:input` will match all form controls
    var $inputs = $('#form-id :input').on('change input',validate);

    function validate(){
       var inValid = $inputs.filter(function(){ 
               return !this.value;
           }).length;
        $('#envia').prop('disabled', inValid );
    }
    // also call function on page load
    validate();

});

这里我使用filter()来检查未设置值的元素集合的长度

Answer 2

这有助于您：

＆＃13;

<html>
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script>
            window.onload = fun;
            function fun(){
                var matr = $("#matricula").val();
                var peca = $("#peca").val();
                var txt1 = $("#data").val();
                var txt2 = $("#quilometros").val();
                if(matr.length==0 || peca.length==0||txt1.length==0||txt2.length==0)
                    $("#envia").prop("disabled",true);
                else
                     $("#envia").prop("disabled",false);
                    
            }
        </script>
            <form action="#">
            <select id="matricula" onchange="fun()">
                <option></option>
                <option value="1">Matricula 1</option>
                <option value="2">Matricula 2</option>
            </select>
            <select id="peca" onchange="fun()">
                <option></option>
                <option value="1">Peca 1</option>
                <option value="2">Peca 2</option>
            </select>
            <input type="text" id="quilometros"   oninput="fun()">
            <input type="text" id="data" oninput="fun()">
            <input type="submit" id = "envia" value="ok">
            </form>
        
    </body>
</html>

＆＃13;

如何在JS中加入几个函数？

2 个答案: