输入对象有问题

Question

我正在尝试创建一个练习，用户必须从单选按钮列表中选择正确的答案。如果用户不认为初始答案是正确答案，则“推荐”单选按钮简单地提出更多选项。此javascript代码从其自己的.js文件运行，并链接到.html页面。但是，当我按任何单选按钮（输入）时，似乎没有任何事情发生，我找不到问题。有人看到了吗？

注意：我还没有把反馈部分放进去，但

以下是Javascript代码：

//setup client case questions
    $('.clientCase input').click(function(){
        var multipleChoiceElement$ = $(this).closest('.clientCase');

        if(this.value!=="2"){ //If a button that isn't the referral is clicked
            multipleChoiceElement$.find('.feedback').show();
            multipleChoiceElement$.find('input').prop('disabled',true);
        }

        if(this.value == "1"){ //the correct answer
            multipleChoiceElement$.find('.answeredCorrectly').show();
        }
        else if(this.value=="2"){//value of 2 means its the referral
            multipleChoiceElement$.find('#clientCaseIS').show();
        }
        else{//the incorrect answer
            multipleChoiceElement$.find('.answeredIncorrectly').show();
        }       
});

以下是该部分的相关HTML代码：

  <!-- Start of multiple choice question -->
       <div class="clientCase">
         <ul class="outline">
         <div id="clientCasePIL"><strong>PIL: Primary Inspection Line</strong>
           <div class="fancyBox">
            <li><strong>1. Admission</strong></li>
            <ul style="list-style-type:none">
             <li><div class="answerOption"><label for="question1A">Verbal</label></div>
              <div class="inputAndIdContainer"><input type="radio" name="question1" value="0" id="question1A"> A.</div></li>
             <li><div class="answerOption">
               <label for="question1B">Stamp</label></div>
              <div class="inputAndIdContainer"><input type="radio" name="question1" value="1" id="question1B"> B.</div></li>
              <li><div class="answerOption">
                <label for="question1C">Document</label></div>
              <div class="inputAndIdContainer"><input type="radio" name="question1" value="0" id="question1C"> C.</div></li><p/>
             <li><div class="answerOption">
               <label for="PILRefusal"><strong>Refusal</strong></label></div>
              <div class="inputAndIdContainer"><input type="radio" name="question1" value="0" id="PILRefusal"> 2.</div></li>
              <li><div class="answerOption">
                <label for="ISReferral"><strong>Referral</strong></label></div>
              <div class="inputAndIdContainer"><input type="radio" name="question1" value="2" id"ISReferral"> 3.</div></li></ul>
             </div>
            </div>

        <div id="clientCaseIS"><strong>Immigration Secondary</strong>
            <div class="fancyBox">
            <li><strong>1. Admission</strong></li>
            <ul style="list-style-type:none">
             <li><div class="answerOption"><label for="question1D">Verbal</label></div>
              <div class="inputAndIdContainer"><input type="radio" name="question1" value="0" id="question1D"> A.</div></li>
             <li><div class="answerOption">
               <label for="question1E">Stamp</label></div>
              <div class="inputAndIdContainer"><input type="radio" name="question1" value="0" id="question1E">
              B.</div></li>
              <li><div class="answerOption">
                <label for="question1F">Document</label></div>
              <div class="inputAndIdContainer"><input type="radio" name="question1" value="0" id="question1F">
              C.</div></li><p/>
              <li><div class="answerOption">
               <label for="ISRefusal"><strong>Refusal</strong></label></div>
              <div class="inputAndIdContainer"><input type="radio" name="question1" value="0" id="ISRefusal"> 2.</div></li></ul>
            </div>
          </div>
        </ul>

        <div class="feedback">
               <div class="answeredCorrectly">Correct</div>
               <div class="answeredIncorrectly">Incorrect</div>
                  <div class="answer">
                  <strong>Answer:</strong> The feedback goes here
          </div>
       </div>
        </div>

Answer 1

您可能希望将函数包装在$(document).ready();中，以便将单击处理程序附加到DOM中的元素：

$(document).ready(function() {

    $('.clientCase input').click(function(){
        // etc..
    });    

});

否则只要你有正确的初始样式，一切似乎都按预期工作。

• DEMO