jQuery检测是否在加载时选择了单选按钮

  • Z时代
  • 2024-01-10
  • 分类：问答

我从下一步按钮中删除禁用的类，当两个单选按钮都被选中时，它工作正常，但问题是当我重新加载页面时，两个单选按钮仍然被检查但下一步中的禁用类不会触发。无论如何，它使工作onload？jQuery检测是否在加载时选择了单选按钮

<input class="SelectMarital" id="marital1" type="radio" name="marital" value="1"/> 
<input class="SelectMarital" id="marital2" type="radio" name="marital" value="2"/> 
<input class="SelectPrice" id="price1" type="radio" name="price" value="1"/> 
<input class="SelectPrice" id="price2" type="radio" name="price" value="2"/> 
<a href="#" id="salary" class="btn disabled">Next Step</a> 
$("input[type=radio]").change(function(){ 
    if($('.SelectMarital').is(':checked') && $('.SelectPrice').is(':checked')) { 
     $("#salary").removeClass('disabled'); 
    }else { 
     $("#salary").addClass('disabled'); 
    } 
});

任何人都可以帮忙吗？

回答：

你可以定义检查函数然后调用它在就绪功能，并且还当你连接喜欢你change事件：

$(function(){ 
    //First call for the load 
    checkRadioButtons(); 
    //Second call for change event 
    $("input[type=radio]").change(checkRadioButtons); 
}); 

$(function() {  
    checkRadioButtons();  
    $("input[type=radio]").change(checkRadioButtons);  
});  
var checkRadioButtons = function() {  
    if ($('.SelectMarital').is(':checked') && $('.SelectPrice').is(':checked')) {  
    $("#salary").removeClass('disabled');  
    } else {  
    $("#salary").addClass('disabled');  
    }  
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  
<input class="SelectMarital" id="marital1" type="radio" name="marital" value="1" checked/> Marital 1  
<input class="SelectMarital" id="marital1" type="radio" name="marital" value="2" /> Marital 2  
<br>  
<input class="SelectPrice" id="price1" type="radio" name="price" value="1" checked/> Price 1  
<input class="SelectPrice" id="price2" type="radio" name="price" value="2" /> Price 2  
<br><br>  
<a href="#" id="salary" class="btn disabled">Next Step</a>

回答：

只是触发您change处理您的页面完成后的.trigger()功能加载：

$("input[type=radio]").change(function() {  
    if ($('.SelectMarital').is(':checked') && $('.SelectPrice').is(':checked')) {  
    $("#salary").removeClass('disabled');  
    } else {  
    $("#salary").addClass('disabled');  
    }  
});  
$(function(){  
    $("input[type=radio]").trigger('change');  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  
<input class="SelectMarital" id="marital1" type="radio" name="marital" value="1" checked/>  
<input class="SelectMarital" id="marital2" type="radio" name="marital" value="2" />  
<input class="SelectPrice" id="price1" type="radio" name="price" value="1" checked/>  
<input class="SelectPrice" id="price2" type="radio" name="price" value="2" />  
<a href="#" id="salary" class="btn disabled">Next Step</a>

回答：

是的，这是很简单的。

创建一个方法并将其作为第一种方法调用，以检查单选按钮的状态是否为选中状态，然后添加类。这是因为你刚刚处理了单选按钮onChange()中的逻辑，所以你没有刷新所需的结果。

$(document).ready(function() { 
    checkRadioButtonStatus(); 
    function checkRadioButtonStatus() { 
     if($('.SelectMarital').is(':checked') && $('.SelectPrice').is(':checked')) { 
      $("#salary").removeClass('disabled'); 
     } 
     else { 
      $("#salary").addClass('disabled'); 
     } 
    } 
});

以上是 jQuery检测是否在加载时选择了单选按钮 的全部内容， 来源链接： utcz.com/qa/265872.html

回到顶部