主页 / 问题 / 1083851
Accepted
Роман Тимохов
Asked:2020-02-17 22:13:39 +0000 UTC2020-02-17 22:13:39 +0000 UTC

定期我没有得到 jQuery 函数的参数

  • 772

id我将元素的值传递给 JQuery 函数的代码并不大（例如带有来回按钮的导航） 。这是布局：

<div class="disF pad10 jsSBa">
    <span id="_prev" class="button-m color-blue mrR4px pager-btn"><b><<</b></span>
    <input type="checkbox" name="xxx" />
    <span id="_next" class="button-m color-blue mrR4px pager-btn"><b>>></b></span>
</div>

事实上，这就是函数本身：

$(".pager-btn").on("click", function (e) {
      console.log(e.target.id);
        $.post("/workspace/changepage", {
            count: e.target.id
        }, function (result) {
            $("#_current_tab").empty();
            $("#_current_tab").append(result);
      });

操作逻辑如下——通过点击元素，向服务器.pager-btn发送请求POST，并在清除该元素后将收到的响应添加到#_current_tab元素中。

因此，情况是这样的，当您单击元素.pager-btn（事件挂在其上）时，每隔一段时间（甚至更多）都不会出现函数（e.target.id- 空）

告诉我有什么收获？

javascript

1 个回答

  1. Best Answer

    您的问题如下。你有一个这样的 DOM： <span id="_prev" class="pager-btn"><b> << </b></span>

    问题是 event.target 不会是<span>a <b>，因为您实际上单击的不是跨度而是 div。

    如何修复它：
    改用- 它将完全等于挂起侦听器的元素，而不是它的后代this。event.target

    重要的！这个技巧不适用于 lambda 函数，但这是另一回事。

    $(".pager-btn")
    .on("click", function (e) {
        var $target = $(this);
        console.log($target.attr("id"));
        $.post("/workspace/changepage", {
            count: $target.attr("id")
        }, function (result) {
            $("#_current_tab").empty();
            $("#_current_tab").append(result);
        });
    });

    此外，如果分页按钮更新，您可以这样做：

    $("body").on("click", ".pager-btn", function (e) {
        var $target = $(this);
        console.log($target.attr("id"));
        $.post("/workspace/changepage", {
            count: $target.attr("id")
        }, function (result) {
            $("#_current_tab").empty();
            $("#_current_tab").append(result);
        });
    });

    然后即使添加了按钮 -​​ 处理程序仍然可以工作

    • 1

相关问题