添加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

回答

相关问题