Question

我有一个像幻灯片一样的测验，可以动态生成问题和答案选项列表。

答案选项是输入类型按钮，是从表格动态生成的。按钮名称也是动态生成的。答案选项的数量是动态的。

当用户点击答案选项时，我需要捕获按钮的名称。

我已经测试了我的代码的几个内容但是没有成功捕获单击的按钮。任何输入，见解都是非常有用的。代码如下。只是一个快速标注 - HTML工作没有问题。我将AMPSCRIPT用于Salesforce Makreting Cloud页面。

＆＃13;

function btnAnswer(){
	var btnClicked = $('.slide :button[clicked]');
	var btnValue = $(btnClicked).val();
	var btnName = $(btnClicked).attr("name");
	var btnQuestion = btnName.substring(0, btnName.indexOf('A'));
	btnQuestion = btnQuestion.substring(btnQuestion.indexOf('Q') + 1);
	var btnAnswer = btnName.substring(btnName.indexOf('A') + 1);
	updateScore(btnQuestion, btnAnswer);
}

<!-- begin snippet: js hide: false console: true babel: false -->

＆＃13;

<div class="slide">
           <p class="question-p">%%=TreatAsContent(FIELD(ROW(@quizData,@qNum),'QuestionBackground'))=%%</p>
           <h3 class="question-h3">%%=TreatAsContent(FIELD(ROW(@quizData,@qNum),'Question'))=%%</h3>
           <div id="" class="question">
            %%[
            SET @answerOptions = BuildRowsetFromString(FIELD(ROW(@quizData,@qNum),'QuestionAnswerOptions'),'|')
            SET @answerCount = RowCount(@answerOptions)
            FOR @aNum = 1 to @answerCount DO
            SET @answer = FIELD(ROW(@answerOptions,@aNum),1)
            ]%%
             <div id="answerOptions">
              <input value="%%=TreatAsContent(@answer)=%%" class="button-submit btnAnswer" name="Q%%=V(@qNum)=%%A%%=V(@aNum)=%%" type="button">
             </div>
            %%[
            NEXT @aNum
            ]%%
            <!-- BEGIN HIDE CRCT ANSWER FOR JS VALIDATION -->
            <input name="crctAnswer" value="%%=V(FIELD(ROW(@quizData,@qNum),'questionCrctAnswerValue'))=%%" type="hidden">
           </div>
           <!-- END HIDE CRCT ANSWER FOR JS VALIDATION -->
           <!-- HIDE/SHOW BASED ON SELECTION -->
           <div id="" class="answer">
            <div class="answer-title" style="display:none;"> <img class="icon" src="http://image.em.pge.com/lib/fe8c13727666037a72/m/6/general_cancel.png">
             <h4 class="answer-h4-incorrect" style="display:none;">You are incorrect.</h4> </div>
            <div class="answer-title" style="display:none;"> <img class="icon" src="http://image.em.pge.com/lib/fe8c13727666037a72/m/6/general_check.png">
             <h4 class="answer-h4-correct" style="display:none;">You are correct!</h4> </div>
            <div class="answer-explaination" style="display:none;">
             <p class="answer-explaination" style="display:none;"><strong>The correct answer.</strong>%%=TreatAsContent(FIELD(ROW(@quizData,@qNum),'QuestionCrctAnswerText'))=%%</p>
            </div>
           </div>
          </div>

＆＃13;

Answer 1

我猜你会像这样使用Jquery：

$(".btnAnswer").click(function() {
    // jQuery way
    var btnValue = $(this).val();
    var btnName = $(this).attr("name");

    // Javascript way
    var btnValue = this.value;
    var btnName = this.name;

    var btnQuestion = btnName.substring(0, btnName.indexOf('A'));
    btnQuestion = btnQuestion.substring(btnQuestion.indexOf('Q') + 1);
    var btnAnswer = btnName.substring(btnName.indexOf('A') + 1);
    updateScore(btnQuestion, btnAnswer);
});

Answer 2

尝试使用jQuery按钮单击处理程序

$(".btnAnswer").click( function() {
    $(this).attr('name');
    // or
    this.name;
});

JQuery或JavaScript - 获取点击的btn名称

2 个答案: