简体   繁体   English

单击事件上的单选按钮需要单击两次

[英]Radio button on click event requires two clicks

Basically I have two radio buttons which sit in a form. 基本上,我有两个单选按钮。 When the first radio button is checked, a form appears which enables a new user to register on the site. 当选中第一个单选按钮时,将出现一个表格,该表格使新用户可以在站点上注册。 The second one is for already registered users who want to sign in. 第二个是针对想要登录的已注册用户的。

I've included some jVal form validation. 我包括一些jVal表单验证。 Now, if I check the second radio button, and type an invalid password in the password field (something that doesn't pass the jVal validation), an error message appears. 现在,如果我检查第二个单选按钮,并在密码字段中输入了无效的密码(未通过jVal验证的密码),则会出现错误消息。 The behavior so far is okay. 到目前为止的行为还可以。 However, if I now check the first radio button (the one for new users), the error message stays there. 但是,如果我现在检查第一个单选按钮(新用户使用的那个),则错误消息将保留在那里。 I've tried to override this by adding a click event to the first radio button, which should hide the error message from the previous screen once clicked. 我试图通过在第一个单选按钮中添加click事件来覆盖此问题,单击该事件将在单击后隐藏上一个屏幕中的错误消息。

radioButton.on('click', function(){
    errorDiv.popover('hide');
    console.log('click event registered');
});

The problem is that I need to click the radio button twice in order to get the click event to register... 问题是我需要单击两次单选按钮才能获取单击事件进行注册...

Anyone got a clue on the issue and why do I have to click the radio button twice so that the event can be registered? 任何人都知道这个问题,为什么我必须单击两次单选按钮才能注册该事件?

This demo shows a solution in action: DEMO 该演示演示了一个实际的解决方案: DEMO

It is a very simple Jquery: 这是一个非常简单的Jquery:

<body>
<form>
  <input type="radio" value="1" name="test" />Value1
  <br />
   <input type="radio" value="2" name="test" />Value2
  <br />
   <input type="radio" value="3" name="test" />Value3
  </form>
  <script>
    $(document).ready(function(){
      $("input[name='test']").click(function(){
        alert($(this).val());
      })
    })
  </script>
</body>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM