Question

首先，我一直在寻找以前的答案并改变我的代码，但我之前读过的解决方案都没有为我工作。基本上我将所有问题和答案保存在jStorage中，我正在尝试创建一个评论页面，其中发布了问题和答案，以及一个新的按钮，将用户链接回到回答问题的页面

我使用两个函数，createReviewPage（）为用户创建页面，显示问题和答案。我也有reviewPageButton（int）。

基本上我需要将reviewPageButton（）函数附加到新创建的按钮上，我一直试图使用。（'click'）在创建函数时找到函数的按钮，但事件在我之前触发甚至点击一个按钮。

我的第一个功能（注意我以前的一些尝试已被注释掉）：

function createReviewPage() {
    var questions = [];
    for (var index = 1; index < 5; index++) {
        questions.push($.jStorage.get("question" + index));
    }
    for (var index = 0; index < questions.length; index++) {
        console.log(questions[index].questionText);
        $('#resultDisplay').append("<h2> You answered " + questions[index].chosenAnswer + " to the question " + questions[index].questionText + "</h2>");
        $('#resultDisplay').append("<input type = 'button' id = 'qbutton" + (index + 1) + "'/>");
        //     $('.qbutton' + (index + 1)).on("click", '#qbutton' + (index+1), invokeButton(index));
        //      $('body').on('click', '.qbutton'+(index+1),reviewPageButton(index));
        $('.qbutton'+(index+1)).on('click',reviewPageButton(index));
        $('#resultDisplay').append("<br> <br> <br>");
    }
}

我的reviewPageButton（）

function reviewPageButton(number) {
    var currentquestion = $.jStorage.get("question" + (number + 1));
    currentquestion.reviewed = "Yes";
    $.jStorage.set("question" + (number + 1), currentquestion);
    window.open("../src/questionpage" + (number + 1) + ".php", "_self");

}

Answer 1

reviewPageButton(index)代表功能执行，请改为reviewPageButton.bind(null, index)。

Answer 2

点击后遗失)并添加逗号（,），您将qbutton设为ID，但您将其用作class

$('#qbutton' + (index + 1)).on('click', reviewPageButton(index));

Answer 3

你能使用jQuery的.bind()方法吗？

尝试替换

$('.qbutton'+(index+1)).on('click',reviewPageButton(index));

带

$('.qbutton'+(index+1)).bind('click',reviewPageButton(index));

Answer 4

我需要将reviewPageButton（）函数附加到新创建的按钮

如果要创建动态按钮，则不应将事件绑定到按钮，而是将它们绑定到父按钮并定位按钮。例如：
```
$('body').on('click', '.custom-button-class', reviewPageButton.bind(null, index) );
```
当您创建一个按钮并将其添加到页面时，使用您的自定义类创建它，当在主体的某个位置触发click事件时，它将检测它是否是具有'custom-button-class'的元素并调用该函数。注意：您应该避免将偶数绑定到 body ，以记住性能。相反，你应该将它绑定到最有意义的评论祖先（例如，div.container）。

这样做只会在浏览器中注册一个事件，这样可以节省浏览器检测周期的时间（提高性能），但也可以在创建动态元素时，因为每个元素都没有自己的相同功能实例。

至少，当您只需要提供对该函数的引用时，您需要修复代码以使其没有语法错误并且不调用该函数：

function createReviewPage() {

    var questions = [];
    for (var index = 1; index < 5; index++) {
        questions.push( $.jStorage.get("question" + index) );
    }

    for (var index = 0; index < questions.length; index++) {
        console.log(questions[index].questionText);

        $('#resultDisplay').append(
           "<h2> You answered " +
            questions[index].chosenAnswer +
            " to the question " +
            questions[index].questionText + 
           "</h2>"
        );

        $('#resultDisplay').append(
           "<input type = 'button' id = 'qbutton" + 
             (index + 1) + 
           "'/>" 
        );

        // --- Problematic Line Changes ---
        // missing first ending parentheses
        // extra comma
        // function call, instead of pointer
        $('.qbutton' + (index + 1)).click(reviewPageButton.bind(null,index));

        $('#resultDisplay').append("<br> <br> <br>");    

    }
}

Answer 5

$('.qbutton'+(index+1)).on('click', function(){
reviewPageButton(index));
};

不要在那里调用函数，只需设置处理程序。也许是这样的？

添加。（'click'）函数到新创建的按钮，在点击

5 个答案: