Question

我正在尝试使用onclick，即使在引导程序中使用无线电但是onclick事件也没有触发。我正在使用此代码

<input type="checkbox" onclick="alert('Scenery!')"/>

但是当我使用

时

 <label class="" onclick="alert('Scenery!')">
            <input type="checkbox" id="scenery-option" onclick="alert('Scenery!')"/> 
        </label>

但是，当我使用上面的代码并点击标签时它的工作但是在单选按钮上它不起作用

Answer 1

您正在使用jQuery。所以你可以像这样解决它：

$(document).on('click', '#scenery-option', function(){
 alert('works');
});

Answer 2

首先您在标题单选按钮中写道，但在示例中，您向我们展示了checkbox。

问题是radio还是checkbox？

<强>其次

您的问题无法复制。请看下面的例子。当您点击checkbox警报显示两次时。一个用于标签，一个用于复选框。
我更改了警告信息，以便您可以看到差异

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet"/>
<label class="" onclick="alert('Label clicked!')">
  Here is some text:
  <input type="checkbox" id="scenery-option" onclick="alert('Checkbox clicked!')"/> 
</label>

＆＃13;

<强>另外

如果是radio和checkbox按钮，我建议使用change事件，当元素值发生变化时会触发该事件。

＆＃13;

$("#scenery-option").on('change', function() {
  alert("Checkbox value changed");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet"/>

<label>
  Here is some text:
  <input type="checkbox" id="scenery-option" /> 
</label>

＆＃13;

单选按钮onclick在bootstrap问题

2 个答案: