JavaScript 单选按钮和事件处理

Question

我正在尝试制作一本带有问题的交互式小册子。

我在 table 中设置了一个示例问题，其中有一个 select 正确答案的单选按钮。

然而，当我运行脚本警报框（测试）时，我立即设置了运行s 并且脚本为空。

确切错误：

Uncaught TypeError: Cannot set property 'onclick' of 
nullinteractive.js:34 mainQuestionOneinteractive.js:38 
(anonymous function)

我的代码:

HTML

    <section class="question-one">
        <h4>Question 1</h4>
        <p>
            Which <stong>one</stong> of the following statements best describes the function of bookkeeping?
        </p>
        <table border="1">
            <tbody>
                <tr>
                    <td>
                        A form of internal accounting providing finanical information at a time and in a format which makes it useable by management for the purpose of planning and controlling a business
                    </td>
                    <td>
                        <input type="radio" name="question-one" id="question-one"/>
                    </td>
                </tr>
                    <td>
                        The mechanistic system of processing and recording the day-to-day financial transactions of a business
                    </td>
                    <td>
                        <input type="radio" name="question-one" id="question-two"  />
                    </td>
                </tr>
                </tr>
                    <td>
                        The mechanistic system of processing and recording the day-to-day financial transactions of a business
                    </td>
                    <td>
                        <input type="radio" name="question-one" id="question-three" />
                    </td>
                </tr>
            </tbody>
        </table>
    </section>

JavaScript

/*--------------------------------------------
QUESTION ONE - LOGIC
----------------------------------------------*/
function mainQuestionOne() {

    var questionOne;
    var questionTwo;
    var questionThree;

    questionOne = document.getElementById('question-one');
    questionTwo = document.getElementById('question-two');
    questionThree = document.getElementById('question-three');

    questionOne.onclick = alert('test');
    questionTwo.onclick = alert('test2');
    questionThree.onclick = alert('test3');
}
mainQuestionOne();

Answer 1

您可以将 alert() 换成 function() {...}。

function mainQuestionOne() {
    var questionOne = document.getElementById('question-one');
    questionOne.onclick = function() { alert('test'); }
}
mainQuestionOne();

JSFiddle Link

Answer 2

试试这个代码

问题一

哪个一以下哪种说法最能描述簿记的功能？

一种内部会计形式，一次提供财务信息，其格式可供管理层用于规划和控制业务处理和记录企业日常财务交易的机械系统处理和记录企业日常财务交易的机械系统

<script type="text/javascript">

    function que1() {
        alert('test1');
    }
    function que2() {
        alert('test2');
    }
    function que3() {
        alert('test3');
    }

</script>

单选按钮的调用函数'onclick'事件

JavaScript 单选按钮和事件处理

JavaScript Radio Buttons and event handling

html

javascript

forms

events