时间戳

首页 > 解决方案 > 为什么这个 jquery 函数会自行循环？

javascript - 为什么这个 jquery 函数会自行循环？

问题描述

好吧，我在表格中显示了一些文本，并添加了一个“阅读更多”按钮来展开文本。但是当我单击此按钮时，我想同时显示“div#selectedItem”中的整个文本。如果为另一个文本单击“阅读更多”按钮，我想用当前文本替换该文本。这里的问题是当我调试我的代码时，我看到当断点到达函数的末尾时，它又从头开始。为什么会这样？

$(".table tbody").on("click",
    ".read-more",
    function readMore(e) {        
        var currentRow = $(this).closest("tr");
        var cellText = currentRow.find("td:eq(1)").text();
        $(this).siblings(".more-text").contents().unwrap();
        $(this).remove();
        e.preventDefault();
        if (clickedTimes > 0)
            $("div#selectedItem").html("");
        $("div#selectedItem").prepend(cellText).html();
        clickedTimes++;
        setTimeout(readMore, 1000);
});

我希望我的功能将独立地为每次点击工作。

标签： javascriptjquery

解决方案

因为在每次调用结束时，您都有一个setTimeoutwhich 会重新调用该函数。删除它，您的代码将不再递归循环：

$(".table tbody").on("click", ".read-more", function readMore(e) {        
    var currentRow = $(this).closest("tr");
    var cellText = currentRow.find("td:eq(1)").text();
    $(this).siblings(".more-text").contents().unwrap();
    $(this).remove();
    e.preventDefault();
    if (clickedTimes > 0)
        $("div#selectedItem").html("");
    $("div#selectedItem").prepend(cellText).html();
    clickedTimes++;
});

推荐阅读