javascript - 单击按钮时更新 div

Question

谁能告诉我这段代码有什么问题。每当单击 a 标签时，我都会尝试使用类显示更新 div

var current = 0;

function nextPage() {
    current++;
    return current;
}

$(document).ready(function (e) {
    $("a").click(function () {
        $(".display").text(nextPage());
        return false;
    });
});

Answer 1

在您的代码行中

$(".display").text(nextPage());

$(".display")返回一组元素。您的实际目标元素可能不是其中的第一个。使用 $.each 遍历每一个或使用 id-selector 指定单个 DOM 元素。

---

.each()示例：（演示）

$(document).ready(function (e) {
    $("a").click(function () {
        $(".display").each(function (index, element) {
            $(element).text(nextPage());
        });
        return false;
    });
});

---

id-selector 示例：（演示）

$(document).ready(function (e) {
    $("a").click(function () {
        $("#display2").text(nextPage());
        return false;
    });
});

Answer 2

为了确保所有动态插入的元素都会有一个事件，请使用.on.

jsFiddle上的这个例子

$(document).on("click", "a", function () {
    $(".display").text(nextPage());
    return false;
});

注意：<!-- comment -->仅适用于 HTML，用于 Javascript// comment或/* comment */