Question

我正在尝试在html单选按钮中使用onclick事件来调用JavaScript程序中的函数。

当我使用按钮时，它可以工作：

HTML5：

<!DOCTYPE html>
<html lang="en">
  <head>
    ...
    <script src="index.js"></script>
    ...
  </head>
  <body>
   <button type="button" class="btn btn-default" onclick="clickedButton1()">Button1</button>
...
  </body>
</html>

JavaScript（在index.js中）：

function clickedButton1 () {
    console.log("clickedButton1")
}

但是当我使用单选按钮时，onclick不会调用该函数：

HTML5（在上面的同一个文件中）：

<section id="radioButtons">
    <form action="" method="post" name="radioButtons" id="radioButtons">
        <div class="btn-group" data-toggle="buttons">
            <label class="btn btn-primary active">
                <input type="radio" name="radios" id="radio1" onclick="test()"> Yes
            </label>
            <label class="btn btn-primary">
                <input type="radio" name="radios" id="radio2" onclick="test()"> No
            </label>
        </div>
    </form>
</section>

Javascript（在index.js中）：

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

我的代码出了什么问题？有什么帮助吗？

Answer 1

您需要实际调用test函数。所以这个onclick="test"应该成为

onclick="test()"

仅仅引用功能还不够，您需要使用()运算符调用它。

Answer 2

您缺少括号。改为onclick="test()"

Answer 3

在行尾添加分号的console.log（ “测试”）;

Answer 4

可以在不调用的情况下调用JavaScript函数。请参阅this

Answer 5

我认为你的javascript在你的html准备好之前加载，你可以通过在body teg中使用你的代码来解决这个问题，或者你可以在index.js文件中使用window.onload。尝试下面的代码我认为它会起作用。< / p>

function test()
{
    alert("Hi");
}


window.onload = function()
{
    document.getElementById("radio1").onclick = test;
};

单选按钮onclick事件不起作用

5 个答案: