Javascript 仅在刷新后加载(Ruby on rails - Materialize CSS)

Question

我将 Ruby on Rails 应用程序与 Materialise CSS 结合使用。

导航中的链接下拉列表适用于仪表板，但在任何其他页面上您必须先刷新它。按钮和选项卡上的波浪效果也是如此。 我已经尝试了 20 种左右的解决方案，但它们都不起作用。

我还有一个未链接到 Materialize CSS 的多步骤表单的 javascript。它用于特定页面上的脚本标记。

 $(document).ready(function () {
    // get all items
    var navListItems = $('div.setup-panel div a'),
        allParts = $('.setup-content'),
        allNextBtn = $('.nextBtn'),
        allPrevBtn = $('.prevBtn');

    allParts.hide();

    navListItems.click(function (e) {
      e.preventDefault();
      var $target = $($(this).attr('href')),
          $item = $(this);
      // hide when disabled
      if (!$item.hasClass('disabled')) {
        navListItems.removeClass('btn-primary').addClass('btn-default');
        $item.addClass('btn-primary');
        allParts.hide();
        $target.show();
        $target.find('input:eq(0)').focus();
      }
    });
    // previous
    allPrevBtn.click(function(){
      var curStep = $(this).closest(".setup-content"),
          curStepBtn = curStep.attr("id"),
          prevStepWizard = $('div.setup-panel div a[href="#' + curStepBtn + '"]').parent().prev().children("a");

      prevStepWizard.removeAttr('disabled').trigger('click');
    });
    //next
    allNextBtn.click(function(){
      //setup next part
      var curStep = $(this).closest(".setup-content"),
          curStepBtn = curStep.attr("id"),
          nextStep = $('div.setup-panel div a[href="#' + curStepBtn + '"]').parent().next().children("a"),
          curInputs = curStep.find("input[type='text']"),
          curRadios = curStep.find("input[type='radio']"),
          curChecks =curStep.find("input[type='checkbox']"),
          isValid = true;

      if (curStep.hasClass('step1')){
        var txt = "";
        if (document.getElementById("snapshot_name").value == null || document.getElementById("snapshot_name").value == "") {
          txt = "You need to fill in a snapshot name";
          document.getElementById("error1").innerHTML = txt;
        }else{
          document.getElementById("error1").innerHTML = txt;
          goToNext(nextStep)
        }
      } else if (curStep.hasClass('step2')){
        var txt2 = "";
        var counter = 0;
        var counterQ1 = 0;
        var counterQ2 = 0;
        for(var i=0; i<curRadios.length; i++){
          if (curRadios[i].checked){
            counter++
          }
        }
        for(var i=0; i<curChecks.length; i++){
          if (curChecks[i].checked){
            var name = curChecks[i].id;
            if (name.search(/Q1/i)){
              counterQ1++
            }else {
              counterQ2 ++
            }

          }
        }

        if (counter == (1) && counterQ1 > 0 && counterQ2 > 0){
          document.getElementById("error2").innerHTML = txt2;
          goToNext(nextStep)
        } else{
          txt2 = "You need to fill in all questions"
          document.getElementById("error2").innerHTML = txt2;
        }
      }
      else if (curStep.hasClass('step3')){
        var txt3 = "";
        var counter = 0;
        var counterQ1 = 0;
        var counterQ2 = 0;
        for(var i=0; i<curRadios.length; i++){
          if (curRadios[i].checked){
            counter++
          }
        }

        if (counter == (5) ){
          document.getElementById("error3").innerHTML = txt3;
          goToNext(nextStep)
        } else{
          txt3 = "You need to fill in all questions"
          document.getElementById("error3").innerHTML = txt3;
        }
      }

      else if (curStep.hasClass('step6')){
        var txt6 = "";
        var counter = 0;
        for(var i=0; i<curRadios.length; i++){
          if (curRadios[i].checked){
            counter++
          }
        }

        if (counter == (14) ){
          document.getElementById("error6").innerHTML = txt6;
          goToNext(nextStep)
        } else{
          txt6 = "You need to fill in all questions"
          document.getElementById("error6").innerHTML = txt6;
        }
      }
      else {
        goToNext(nextStep)
      }

    });

    $('div.setup-panel div a.btn-primary').trigger('click');
  });

  function goToNext(nextStep){
      nextStep.removeAttr('disabled').trigger('click');
      nextStep.removeClass('disabled').trigger('click');
  }

有人知道我可以尝试哪种解决方案吗？

Answer 1

我从 application.js 中删除了 require turbolinks 。 我以前试过这个，但后来没用。 现在它做到了。 非常感谢试图提供帮助的人。