#javascript #php #jquery #html #nouislider
#javascript #php #jquery #HTML #nouislider
Вопрос:
Я хочу удалить строку таблицы, щелкнув по ее дочернему элементу.
//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, и вы увидите, что значок удаления работает, почему?
Комментарии:
1. Проверьте ошибки, возникающие в консоли инструментов разработчика браузера. Демо сразу говорит вам, что UISlider не является функцией… что означает, что зависимость отсутствует
2. @charlietfI зависимость не была добавлена в скрипку, но она есть в моем проекте. Ползунок ценового диапазона работает, но при добавлении вместе с функцией удаления строки таблицы последняя не работает. Я попробую добавить зависимость в скрипку
3. но более широкий смысл is…do у вас есть какие-либо ошибки?
4. @charlietfl Вы правы, в консоли есть ошибка, хотя на странице слайдера ценового диапазона все работает. В строке удаления таблицы есть ‘Uncaught TypeError: не удается прочитать свойство ‘nodeName’ null’, на странице слайдера ценового диапазона есть ‘Uncaught ReferenceError: $ не определен’
5. ну
$ not defined
, это легко найти
Ответ №1:
В вашей скрипке js noUiSlider.create
сбой с ошибкой.Это также произошло с вашим реальным кодом? Любая предыдущая ошибка скрипта приведет к тому, что привязка последнего события не будет работать. Попробуйте переместить значок удаления в начало вашего скрипта для тестирования.
Комментарии:
1. noUiSlider отлично работал в моем проекте. Я обновлю JSfiddle, чтобы включить зависимость.
2. Спасибо за ваш ответ, я знаю, что установка скрипта удаления значка в начало будет работать, что имеет тот же эффект, что и удаление noUiSlider jQuery, дело в том, почему?
3. Если вы обновили скрипку с правильным исходным кодом noUiSlider, она по-прежнему завершается ошибкой
Uncaught TypeError: Cannot read property 'nodeName' of null
. Я предлагаю, чтобы ваша консоль оставалась открытой при отладке вашего веб-сайта. Как я уже сказал в своем ответе. ВnoUiSlider
вашем приложении все еще есть проблемы.