jQuery焦点文本字段检查单选按钮

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery焦点文本字段检查单选按钮相关的知识,希望对你有一定的参考价值。

我忙着一点形式,但现在我被困住了。

我有这个小代码:

jQuery('#textinput input').click(function() {
    if (jQuery(this).is(':focus')) {
        jQuery('input:radio[name=open_amount]').attr('checked',true);
    } else { 
        jQuery('input:radio[name=open_amount]').attr('checked',false);
    }
 }); 

这是工作的一半。当我在输入文本中键入内容时,将检查radiobutton,但如果我改变主意并检查其他一些单选按钮,则html代码中的检查不会被删除。

当我输入一个值时,改变主意并检查另一个单选按钮并返回输入文本,然后单选按钮不会自动更改。

那我错了什么?

答案

你必须使用.focus.blur而不是.click

您还必须使用.prop来设置无线电btn

jQuery(function() {

  jQuery('#textinput input').focus(function() {
    jQuery('input:radio[name=open_amount]').prop('checked', true);
  });

  jQuery('#textinput input').blur(function() {
    jQuery('input:radio[name=open_amount]').prop('checked', false);
  });

  //Suggestion: You can add this so that when user clicks on the radio btn, it will fucos on the textbox
  jQuery('input:radio[name=open_amount]').click(function(){
    jQuery('#textinput input').focus();
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="textinput">
  <input type="text">
</div>

<input type="radio" name="open_amount" />

以上是关于jQuery焦点文本字段检查单选按钮的主要内容,如果未能解决你的问题,请参考以下文章

使用 jQuery 检查文本框焦点 [重复]

获得广播组中单选按钮的焦点

使用jquery选择单选按钮文本字段和下拉菜单

如果文本框处于焦点,则禁用 jQuery 事件

如何通过检查另一个单选按钮来设置选中的单选按钮

禁用jQuery UI datepicker的焦点设置