Javascript 使用jQuery在现有功能的基础上构建代码,以检查是否有任何输入框具有值
我真的需要你的帮助。我刚刚得知我是jQuery库的新手 顺便说一下,我希望得到一些帮助,以便在现有代码的基础上进行构建(我在文章中的目的是检查并查看是否有任何选择框具有任何附加到更改事件的选择选项值,因此如果有任何选择框具有任何选择选项值,则启用搜索按钮,如果没有,则将其保持禁用状态 现在,对我来说,这是一个非常棘手的问题,如何修改现有的代码,以便同时检查(与下面的代码并行)是否有任何输入框也有任何输入值 因此,典型场景的预期结果是,如果用户在任何选择框中进行了选择或在表单中键入了任何文本,则启用搜索按钮;如果表单不包含任何选定选项且所有输入框均为空,则禁用#搜索按钮 下面是有问题的HTML标记和代码:Javascript 使用jQuery在现有功能的基础上构建代码,以检查是否有任何输入框具有值,javascript,jquery,html,forms,Javascript,Jquery,Html,Forms,我真的需要你的帮助。我刚刚得知我是jQuery库的新手 顺便说一下,我希望得到一些帮助,以便在现有代码的基础上进行构建(我在文章中的目的是检查并查看是否有任何选择框具有任何附加到更改事件的选择选项值,因此如果有任何选择框具有任何选择选项值,则启用搜索按钮,如果没有,则将其保持禁用状态 现在,对我来说,这是一个非常棘手的问题,如何修改现有的代码,以便同时检查(与下面的代码并行)是否有任何输入框也有任何输入值 因此,典型场景的预期结果是,如果用户在任何选择框中进行了选择或在表单中键入了任何文本,则启
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jq/jquery.js"></script>
<script type="text/javascript">
window.onload = function() {
$('#myform').on('change', function() {
var form = $(this);
form.find('#search').prop('disabled', form.find('select option:selected').filter(function() {
return this.value.length;
}).length === 0)
}).change();
}
</script>
</head>
<body>
<form id="myform">
Cars
<select id="car">
<option value=""></option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
<br><br>
Fruits
<select id="fruits">
<option value=""></option>
<option value="apple">apple</option>
<option value="banana">banana</option>
<option value="pear">pear</option>
<option value="strawberry">strawberry</option>
<option value="mango">mango</option>
<option value="orange">orange</option>
</select>
<br><br>
Vegetable
<input type="input" id="veggie">
<br><br>
Number
<input type="input" id="number">
<br><br>
<input type="button" value="search" id="search" disabled>
</form>
</body>
</html>
window.onload=函数(){
$('#myform')。on('change',function(){
变量形式=$(此);
form.find('#search').prop('disabled',form.find('select option:selected')).filter(function(){
返回此.value.length;
}).length==0)
}).change();
}
汽车
沃尔沃汽车
萨博
梅赛德斯
奥迪
水果
苹果
香蕉
梨
草莓
芒果
橙色
蔬菜
数
具有测试所有输入的通用功能
考虑$(':input:not([type=“button”])
以选择不包括按钮的所有输入
window.onload=function(){
var validateForm=函数(){
return$(':input:not([type=“button”])。筛选器(function()){
返回此值!='';
}).长度;
}
$('#myform')。在('change keyup',':input',function()上{
$('#search').prop('disabled',!validateForm());
}).change();
}
汽车
沃尔沃汽车
萨博
梅赛德斯
奥迪
果实
苹果
香蕉
梨
草莓
芒果
橙色
蔬菜
数
具有测试所有输入的通用功能
考虑$(':input:not([type=“button”])
以选择不包括按钮的所有输入
window.onload=function(){
var validateForm=函数(){
return$(':input:not([type=“button”])。筛选器(function()){
返回此值!='';
}).长度;
}
$('#myform')。在('change keyup',':input',function()上{
$('#search').prop('disabled',!validateForm());
}).change();
}
汽车
沃尔沃汽车
萨博
梅赛德斯
奥迪
果实
苹果
香蕉
梨
草莓
芒果
橙色
蔬菜
数
该代码不起作用。如果在单个输入框中键入了文本,则“搜索”按钮将保持灰色,同时忽略任一选择框中的选择。@BobbyJones–是否要在所有输入有效或任何输入有效后启用该按钮?基本上,只要在没有选择框具有选定对象时禁用“搜索”按钮即可如果输入中没有文本,如果其中任何一个选择框有一个选择选项值,该值不为空,或者如果任何一个输入框中有文本,则启用搜索按钮。你做到了,人造丝!我现在接受你的解决方案。我绝对无法独自解决这个问题。非常感谢你!@BobbyJones–这很有趣r我也是!我很高兴它帮助了mate!快乐编码代码不起作用。如果在单个输入框中键入了文本,则搜索按钮将保持灰色,同时忽略任一选择框中的选择。@BobbyJones–是否要在所有输入有效或任何输入有效后启用该按钮?基本上,只需禁用搜索按钮即可按钮当没有选择框有一个选中的选项,如果输入中没有文本,如果任一选择框有一个不为空的选择选项值,或者如果任何输入框中有文本,则启用搜索按钮。你做到了,人造丝!我现在接受你的解决方案。我自己肯定无法解决这个问题。谢谢你非常感谢你!@BobbyJones–这对我来说也很有趣!我很高兴这对mate有帮助!快乐