好的，我已经在网站上编写了一段时间，这是我第一次找不到的“难以逾越的”问题，所以现在我转向你，专家。
在我的表单上，我有三个下拉菜单，一个文本框和一个禁用复选框。我希望它能够工作，以便当用户从每个下拉菜单中选择一个选项并在文本框上写入内容时，该复选框将启用。
当我一直在寻找解决方案时，我找到了this code，这与我的问题非常相似。但是，当我尝试添加另一个下拉菜单时，当我从第一个菜单中选择一个选项并完全忽略第二个菜单时，它仍然启用该按钮。对不起，我是Jquery / JavaScript的新手，我认为当两个菜单上的类名相同时（jQuery类选择器：（'。dropdown'）），我应该这样工作。
我还找到了a similar code with textboxes。我只是不知道如何组合这些代码，所以它会按照我想要的方式行事。
答案 0 :(得分：1)
我认为下拉列表的默认值为value =“”
$('#form_submit_button').click(function(){
$('.checkbox').attr('disabled',true);
var all_selected = true;
$('.dropdown').each(function(){
if(!$(this).val())
{
all_selected = false;
}
});
if(!$('#text_box').text())
{
all_selected = false;
}
if(all_selected)
{
$('.checkbox').attr('disabled',false);
}
});
答案 1 :(得分：1)
请在此处查看：http://jsfiddle.net/JKmkL/109/
$(document).ready(function() {
$('.required').change(function() {
var done=true;
$('.required').each(function(){
if(!$(this).val()){
$('.myCheckBox').prop('disabled',true);
done=false;
return false;
}
});
if(done){$('.myCheckBox').prop('disabled',false);}
});
});
将类required添加到元素中。
修改
上面的代码假设默认<option>有value=""。如果没有，您可以使用http://jsfiddle.net/JKmkL/114/
$(document).ready(function() {
$('.required').change(function() {
var done=true;
function quit(){
$('.myCheckBox').prop('disabled',true);
done=false;
return false;
}
$('.required.dropdown').each(function(){
if($(this).children(':selected').hasClass("disablenext")){
return quit();
}
});
$('.required[type=text]').each(function(){
if(!$(this).val()){
return quit();
}
});
if(done){$('.myCheckBox').prop('disabled',false);}
});
});
编辑2：
如果要在选中复选框时显示div，并在禁用该复选框时隐藏它，请使用
JavaScript的：
$(document).ready(function() {
$('.required').change(function() {
var done=true;
function quit(){
$('.myCheckBox').prop('disabled',true).removeAttr('checked');
done=false;
$('#div2').addClass('hide');
return false;
}
$('.required.dropdown').each(function(){
if($(this).children(':selected').hasClass("disablenext")){
return quit();
}
});
$('.required[type=text]').each(function(){
if(!$(this).val()){
return quit();
}
});
if(done){$('.myCheckBox').prop('disabled',false);}
});
$('.myCheckBox').click(function(){
$('#div2')[(this.checked?'remove':'add')+'Class']('hide');
});
});
CSS：
.hide{display:none}
答案 2 :(得分：0)
首先，请说三个下拉菜单的ID称为d1，d2和d3;文本框为txt;和复选框是chk。然后，您可以定义一个确定何时必须启用该复选框的函数：
function shouldEnableCheckbox() {
var nonEmptyFields = $("#d1,#d2,#d3,#txt").filter(function() {
return this.value;
});
return nonEmptyFields.length == 4;
}
基本上，您选择所有4个元素，过滤那些非空的元素，并将得到的过滤后的数组与4进行比较。如果为真，则表示您应该启用该复选框。
然后，将change事件处理程序分配给所有4个元素，调用前一个函数，并将结果分配给复选框的disabled属性：
$("#d1,#d2,#d3,#txt").change(function() {
$("#chk").prop("disabled", !shouldEnableCheckbox());
});