时间戳

首页 > 解决方案 > 一个操作的多个获取请求

javascript - 一个操作的多个获取请求

问题描述

我目前有一个 CRUD 提醒应用程序，并且有一个上下文菜单，其中包含编辑、删除等选项。上下文菜单上的按钮根据提醒 id 进行更新，并将 ids 传递给引导模式表单。

function toggleMenuOn(e) {
    if ( menuState !== 1 ) {
      menuState = 1;
      menu.classList.add( contextMenuActive );
    }

    let reminder_id = e.target.id
    let context_btn1 = document.getElementById("context_menu_btn1");
    let reminder_pk = reminder_id.replace("reminder", "");
    let reminder_url = "{% url 'update-reminder' 0 %}".replace(/0/, reminder_pk) 
    context_btn1.className = "update-reminder context-menu__link btn btn-light";
    context_btn1.setAttribute('data-id', reminder_url);
    $("#context_menu_btn1").modalForm({formURL: reminder_url});
  }

但是，当我查看命令行时，我看到了许多一键单击的 GET 请求：

[22/Dec/2019 17:50:01] "GET /update_reminder/8/ HTTP/1.1" 200 4650
[22/Dec/2019 17:50:01] "GET /update_reminder/4/ HTTP/1.1" 200 4681
[22/Dec/2019 17:50:01] "GET /update_reminder/8/ HTTP/1.1" 200 4650
[22/Dec/2019 17:50:01] "GET /update_reminder/4/ HTTP/1.1" 200 4681

有趣的是，当第一次加载页面并单击提醒上的编辑时，会出现一个 GET 请求。但是当我再次单击它时，会出现 2 个 GET 请求，并带有交替链接，如上所示。在第三次编辑点击 3 GET 请求出现。我查看了检查元素中的网络选项卡并显示相同。这是一个问题，因为它会减慢页面速度，并且有时会返回不正确的表单 url。我对它发生的方式和原因非常迷茫，因为 modalForm 只被调用一次。

标签： javascriptdjangogetbootstrap-modal

解决方案

modalForm每次切换菜单时都会创建一个新菜单，因为您将其声明放在toggleMenuOn. 相反，您应该声明一次（当应用程序加载时），请参阅他们的 README：

<script type="text/javascript">
$(document).ready(function() {

    $(".create-book").modalForm({
        formURL: "{% url 'create_book' %}"
    });

});
</script>

推荐阅读