Question

我有一个我认为可以解决但没有解决的问题。

我的侧边菜单切换按钮的javascript首次加载到版式时不起作用，但是在同一版式中单击链接后将起作用。这样一来，在相同布局中的任何页面重新加载上都将无法正常工作。

我通过添加...来“解决”它。

//= require check_width_toggle到我的application.js

完整的application.js：

//= require rails-ujs
//= require activestorage
//= require check_width_toggle
//= require jquery3
//= require popper
//= require bootstrap-sprockets
//= require turbolinks
//= require_tree .

这仅在jquery3以上时有效

尽管我注意到它正在干扰其他javascript，但是我能够通过添加来纠正这些情况：

 <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" ></script>

...使用javascript在视图顶部。

但是我还有另一段JavaScript干扰了我到目前为止所做的任何事情都无法解决的问题。

这是我的复选框检查器，用于查看在加载和点击时选中了多少个复选框...

复选框 JS ：

function updateCheckboxes() {
  var $cs = $('#checkbox input:checkbox:checked');
  if ($cs.length >= 4) {
    $('#checkbox input:checkbox:not(:checked)').attr("disabled", true);
  } else {
    $('#checkbox input:checkbox').attr("disabled", false);
  }
}

$(document).on('turbolinks:load', function() {
  updateCheckboxes();
  $('#checkbox input:checkbox').change(updateCheckboxes)
})


$(".rotate").click(function(){
$(this).toggleClass("down")  ;
})

这是菜单切换的 JS ，似乎很混乱。请记住，我使用涡轮链接，所以如果您看到任何代码，请随时更改以让我知道建议

$(function(){

  function checkWidthAndToggle() {
      if($(window).width()<=992){
          $("#wrapper").removeClass("toggled");
      }else{
          $("#wrapper").addClass("toggled");
      }
  }

  $("#menu-toggle").click(function(e) {
      e.preventDefault();
      $("#wrapper").toggleClass("toggled");
  });

  $(window).resize(checkWidthAndToggle);

  checkWidthAndToggle();
});

不需要文件“ check_width_toggle”就发出：

1。在将页面加载到布局中时，不会单击切换。

2。除非单击链接，否则将不会单击切换。

3。不会在页面重新加载时单击切换。

除了菜单开关本身之外，其他所有JS都应有其优点。

存在以下要求：

1。干扰其他JS脚本标签和文件。

-通过为jquery添加脚本标签“解决了”问题，但不适用于所有人

2。特别干扰复选框功能的javascript代码。

其他通知：

当我删除需求并使用时：

<%= javascript_include_tag 'application', 'check_width_toggle', 'data-turbolinks-track': 'reload' %>

反对：

<%= javascript_include_tag 'check_width_toggle' %>

这一定是turbolinks问题吗？

使用...data-turbolinks-track...时完全相反它仅在加载和重新加载时起作用。如果我单击布局后面的链接，它将停止工作。

我想要的：

要使菜单切换在任何情况下都可以单击。我注意到代码中的宽度检查器将始终正常工作，似乎切换类的单击功能似乎是问题所在

是否有充分的理由在树底放上树，例如行刑顺序？从我之前被告知和阅读过的内容来看，树应该始终位于底部吗？

JavaScript会干扰其他特定的JavaScript

0 个答案: