添加noUiSlider後jQuery不工作jQuery

我想通過單擊其子元素來刪除錶行。添加noUiSlider後jQuery不工作jQuery

//cart remove line 
    $('.cartlineremove').click(function(e) { 
    $(this).closest('tr').remove() 
    });

這已經過測試，它的工作原理。

但是，當我添加其他一些jQuery方法（一些功能的另一個php頁面，但我所有的jQuery是在main.js中），刪除圖標不再工作。爲什麼？

 //on search page, price range slider 
     var handlesSlider = document.getElementById('slider-handles'); 
      noUiSlider.create(handlesSlider, { 
      start: [ 0, 5000 ], 

      range: { 
       'min': [ 0 ], 
       'max': [ 5000 ] 
      }, 
      format: wNumb({ 
       decimals: 0 
      }) 
      }); 

      var inputPriceMin = document.getElementById('pricemin'); 
      var inputPriceMax = document.getElementById('pricemax'); 

      handlesSlider.noUiSlider.on('update', function(values, handle) { 

      var value = values[handle]; 

      if (handle) { 
       inputPriceMax.value = value; 
      } else { 
       inputPriceMin.value = value; 
      } 
      }); 

      inputPriceMin.addEventListener('change', function(){ 
      handlesSlider.noUiSlider.set([this.value, null]); 
      }); 

      inputPriceMax.addEventListener('change', function(){ 
      handlesSlider.noUiSlider.set([null, this.value]); 
      }); 


      handlesSlider.noUiSlider.on('change', function(){ 
      var $form = $('#filterform'); 
      var formData = $form.serialize(); 
      $('#pricespinner').addClass('active'); 
      $.post('find.php', formData, function(response){ 
       // do something with response 
       $('#results').load('results.php'); 
       // do something with response ends 
      }) 
      .done(function() { 
       $('#pricespinner').removeClass('active'); 
      }) 

      .fail(function(){ 
       alert("Oops something bad happened"); 
      }); 
      }); 

    //on cart page, cart remove line 
    $('.cartlineremove').click(function(e) { 
    $(this).closest('tr').remove() 
    });

我有一種感覺，這是由於noUiSlider DOM，但究竟是什麼使得它如此這樣的，我在價格區間滑塊加入jQuery的那一刻，刪除圖標停止工作？

更新https://jsfiddle.net/sq66f4ak/5/。

嘗試刪除noUIslider jQuery，你會看到刪除圖標的工作原理，爲什麼？

來源

2016-10-11 iWillGetBetter

檢查瀏覽器開發工具控制檯中拋出的錯誤。演示會立即告訴你，uiSlider不是一個函數......這意味着缺少一個依賴關係。 – charlietfl

@charlietfI依賴關係未添加到小提琴中，但它在我的項目中。價格範圍滑塊可以工作，但與刪除表格行功能一起添加時，後者無法工作。我試着在小提琴 – iWillGetBetter

中添加依賴關係，但是更廣泛的一點是......你是否有任何錯誤顯示？ – charlietfl

在您的js小提琴中，noUiSlider.create因錯誤而失敗。您的真實密碼也出現這種情況嗎？任何以前的腳本錯誤都會導致最後一個事件綁定不起作用。嘗試將移除圖標點擊移至腳本頂部以進行測試。

來源

2016-10-11 02:33:12 amow

noUiSlider在我的項目中工作得很好。我將更新JSfiddle以包含依賴項。 – iWillGetBetter

感謝您的回答，我知道將刪除圖標點擊腳本放在頂部會起作用，這與刪除noUiSlider jQuery具有相同的效果，原因是什麼？ – iWillGetBetter

如果使用正確的noUiSlider源代碼更新了小提琴，它仍然失敗，錯誤爲'Uncaught TypeError：無法讀取'null'屬性'nodeName'。我建議當你調試你的web時，讓你的控制檯保持打開狀態。正如我在回答中所說的。'noUiSlider'在你的應用程序中仍然存在問題。 – amow

添加noUiSlider後jQuery不工作jQuery

回答

相關問題