输入类型“ radio” jQuery的Click事件

时间:2018-09-26 09:10:40

标签: javascript jquery

无法将事件分配给单选按钮。我已经用谷歌搜索了这个问题,有很多不同的解决方案,但是没有帮助。

我尝试的最后一个解决方案是:

$(document).ready(function() {
  $("#monthly input[name=pricing-1]").click(function() {
    console.log("Test");
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="btn-group btn-group-toggle" data-toggle="buttons">
  <label class="btn btn-round btn-outline-primary w-150 active">
        <input id="monthly" name="pricing-1" value="monthly" autocomplete="off" checked="" type="radio"> Monthly
      </label>
</div>

但是当我单击按钮时什么也没有发生。怎么了?

2 个答案:

答案 0 :(得分:1)

问题:

主要问题来自选择器#monthly input[name=pricing-1],该选择器将搜索名称为pricing-1的输入,该输入为ID为monthly的元素的子代。

解决方案:

您必须使用$("input[name=pricing-1]")$("#monthly")作为选择器,因为两者都引用相同的元素:

$(document).ready(function() {
  $("#monthly").click(function() {
    console.log("Test 1");
  });
  $("input[name=pricing-1]").click(function() {
    console.log("Test 2");
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="btn-group btn-group-toggle" data-toggle="buttons">
  <label class="btn btn-round btn-outline-primary w-150 active">
        <input id="monthly" name="pricing-1" value="monthly" autocomplete="off" checked="" type="radio"> Monthly
      </label>
</div>

答案 1 :(得分:0)

尝试一下:在输入中添加onclick =“ name_func”

<input onclick="test()" id="monthly" name="pricing-1" value="monthly" autocomplete="off" checked="" type="radio"> Monthly

在您的JS中:

function test() { console.log("test"); }