Javascript僅在刷新后加載（Ruby on rails-Materialize CSS）

Question

我將Ruby on Rails應用程序與Materialize CSS結合使用。

導航中的鏈接下拉列表可在儀表板上使用，但在其他任何頁面上，您都必須先刷新它。 按鈕和選項卡上的波浪效果相同。 我已經嘗試了20種左右的解決方案，但是它們沒有起作用。

我也有一個JavaScript，用於不與Materialize CSS鏈接的多步驟表單。 在特定頁面的腳本標簽中使用它。

 $(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。 我以前嘗試過此方法，但后來沒有用。 現在做到了。 因此，感謝嘗試提供幫助的人。