Question

我在表单中有三个部分，第一个包含一个输入，第二个包含三个输入，第三个包含一个复选框。如何

如果选中复选框，则禁用这两个部分
如果我点击了其他部分中的文字，则禁用该复选框和部分
启用三个部分（如果所有部分都为空）

每次我必须只有一个活动部分。

我所做的不是解决方案，因为第二部分存在问题。如果本节中只有一个输入为空，则启用所有其他输入。任何人都可以帮助我。谢谢，抱歉我的英文

＆＃13;

document.getElementById("client").onblur = function () {
            if (this.value.length > 0) {
                document.getElementById("FirstName").disabled=true;
                document.getElementById("LastName").disabled=true;
                document.getElementById("Email").disabled=true;
                document.getElementById("standard").disabled=true;
            }else {
                document.getElementById("FirstName").disabled=false;
                document.getElementById("LastName").disabled=false;
                document.getElementById("Email").disabled=false;
                document.getElementById("standard").disabled=false;
            }
        }
        
        document.getElementById("FirstName").onblur = function () {
            if (this.value.length > 0) {
                document.getElementById("client").disabled=true; 
                document.getElementById("standard").disabled=true;
            }else {
                document.getElementById("client").disabled = false;
                document.getElementById("standard").disabled = false;
            }
        }
        document.getElementById("LastName").onblur = function () {
            if (this.value.length > 0) {
                document.getElementById("client").disabled=true; 
                document.getElementById("standard").disabled=true;
            }else {
                document.getElementById("client").disabled = false;
                document.getElementById("standard").disabled = false;
            }
        }
        document.getElementById("Email").onblur = function () {
            if (this.value.length > 0) {
                document.getElementById("client").disabled=true; 
                document.getElementById("standard").disabled=true;
            }else {
                document.getElementById("client").disabled = false;
                document.getElementById("standard").disabled = false;
            }
        }
        document.getElementById("standard").onblur = function () {
            if (this.checked) {
                document.getElementById("client").disabled=true; 
                document.getElementById("FirstName").disabled=true;
                document.getElementById("LastName").disabled=true;
                document.getElementById("Email").disabled=true;
            }else {
                document.getElementById("client").disabled=false; 
                document.getElementById("FirstName").disabled=false;
                document.getElementById("LastName").disabled=false;
                document.getElementById("Email").disabled=false;
            }
        }

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
	<div class="col-md-4">
		<div class="row">
			<div class="form-group col-md-12">
				<label>Search Client</label>
			</div>
		</div>
		<div class="row">
			<div class="form-group col-md-12">
				<div class="input-group custom-search-form margin-bottom">
					<input id="client" name="client" type="text" class="form-control input-sm" placeholder="Search...">
					<span class="input-group-btn">
						<button class="btn btn-default btn-sm" type="button">
							<i class="fa fa-search"></i>
						</button>
					</span>
				</div>
			</div>
		</div>
	</div>
	<div class="col-md-8">
		<div class="row">
			<div class="form-group col-md-12">
				<label>New Client</label>
			</div>
		</div>
		<div class="row">
			<div class="form-group col-md-4">
				<input type="text" class="form-control input-sm" id="FirstName" placeholder="First Name">
			</div>
			<div class="form-group col-md-4">
				<input type="text" class="form-control input-sm" id="LastName" placeholder="Last Name">
			</div>
			<div class="form-group col-md-4">
				<input type="email" class="form-control input-sm" id="Email" placeholder="Email">
				
			</div>
		</div>
	</div>
</div>

<div class="checkbox margin-bottom">
	<label>
		<input id="standard" type="checkbox" value="">Standard
	</label>
</div>

＆＃13;

Answer 1

听起来你可能想要尝试焦点监听器而不是on Blur监听器。

https://developer.mozilla.org/en-US/docs/Web/Events/focus

当我输入所有字段的值时，第二个元素似乎有效。看起来它正在检查输入的长度。

如果单击另一个输入，则禁用输入

1 个答案: