如何选择名称字段和描述字段并填写字段，需要单击下一步按钮

Question

如何使用jQuery选择器填充这些字段

HTML 代码如下

<div class="col-xs-4 h100">
<div class="title">What do you want to name your application as ?</div>
<div class="help-text tMargin10">The name you provide here will be the application name used. Typically, it is the project name or repo name.</div>
<div class="row applicationName">
<form id="create-application-form">
<div class="form-group">
<label>Name your Application </label>
<i class="fa fa-question-circle" title="The name you provide here will be the application name. Typically, it is the project name or repo name. Application name must begin with an alphabet and recommend not to use consecutive _, -, whitespaces. Ex - My_app_name, my app name, my-app-name are allowed. Please avoid names like my___app___name, my app name, or my-----app----name"></i>
<span class="mandatory" title="Mandatory">*</span>
<input class="form-control behavior-validate required" data-validation="[{"rule":"application_name"}]" minlength="4" maxlength="21" name="name" value="" type="text">
</div>
<div class="form-group">
<label>Description</label>
<textarea class="form-control" name="description"></textarea>
<div class="help-text">This description will be displayed to users who may want to join your team. (Optional)</div>
</div>
</form>
</div>
<div class="viewActions text-right">
<button class="btn btn-primary continue next hasError" type="button" title="Mandatory field missing" disabled="disabled">Next</button>
</div>
</div>

请帮助我使用jQuery选择器。

Answer 1

在这里，您可以使用解决方案 https://jsfiddle.net/s4mz5kf8/2/

var data = {name:"", description: ""}
$('input[name="name"], textarea[name="description"]').focusout(function(){
data[$(this).attr('name')] = $(this).val();

if(data.name != "" && data.description != ""){
console.log(data);
$('.next').removeAttr('disabled').click();
} else {
$('.next').attr('disabled', 'disabled');
}
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-xs-4 h100">
<div class="title">What do you want to name your application as ?</div>
<div class="help-text tMargin10">The name you provide here will be the application name used. Typically, it is the project name or repo name.</div>
<div class="row applicationName">
<form id="create-application-form">
<div class="form-group">
<label>Name your Application </label>
<i class="fa fa-question-circle" title="The name you provide here will be the application name. Typically, it is the project name or repo name. Application name must begin with an alphabet and recommend not to use consecutive _, -, whitespaces. Ex - My_app_name, my app name, my-app-name are allowed. Please avoid names like my___app___name, my app name, or my-----app----name"></i>
<span class="mandatory" title="Mandatory">*</span>
<input class="form-control behavior-validate required" data-validation="[{"rule":"application_name"}]" minlength="4" maxlength="21" name="name" value="" type="text">
</div>
<div class="form-group">
<label>Description</label>
<textarea class="form-control" name="description"></textarea>
<div class="help-text">This description will be displayed to users who may want to join your team. (Optional)</div>
</div>
</form>
</div>
<div class="viewActions text-right">
<button class="btn btn-primary continue next hasError" type="button" title="Mandatory field missing" disabled="disabled">Next</button>
</div>
</div>

我正在检查两个input textbox，如果任何input textbox为空，那么下一个button将被禁用。

希望这对您有所帮助。