Здравствуйте.
Возник вопрос: как привязать определённую кнопку к определённому скрипту?
На странице имеются две кнопки <button> и два скрипта. Как сделать так, чтобы по каждому нажатию первой кнопки выполнялся только первый скрипт, а по каждому нажатию второй кнопки выполнялся только второй скрипт. Как это можно реализовать?
Вот, собственно, сам код. Сейчас при нажатии на любую кнопку выполняется действие только второго скрипта, и только один раз, после чего никакой реакции на нажатия не происходит. Если же один из скриптов удалить, то другой работает как надо, но только на первой кнопке. Но требуется, чтобы именно действие определённой кнопки было привязано к определённому скрипту.
Что и куда тут следует прописать?
Код:
|
<button data-sort="-1">Сортировать по-мощности</button>
<button data-sort="-1">Сортировать по цене</button>
<script>
// Фильтр
$('select').change(function(){
$('.catitem').removeClass('hidden');
var power = $(this).val();
$('.catitem').each(function(){
if($(this).data('power') != power && power > 0) {
$(this).addClass('hidden');
}
});
});
// Сортировка
$('button').click(function(){
if($(this).data('sort') == -1) {
$(this).data('sort', 1);
}else {
$(this).data('sort', -1);
}
var listCat = $('.catitem');
listCat.sort(function(a,b){
return ($(a).data('power') - $(b).data('power')) * $('button').data('sort') ;
});
listCat.each(function(idx,itm){
$('.catitems').append(itm);
});
});
</script>
<script>
// Фильтр
$('select').change(function(){
$('.catitem').removeClass('hidden');
var price = $(this).val();
$('.catitem').each(function(){
if($(this).data('price') != price && price > 0) {
$(this).addClass('hidden');
}
});
});
// Сортировка
$('button').click(function(){
if($(this).data('sort') == -1) {
$(this).data('sort', 1);
}else {
$(this).data('sort', -1);
}
var listCat = $('.catitem');
listCat.sort(function(a,b){
return ($(a).data('price') - $(b).data('price')) * $('button').data('sort') ;
});
listCat.each(function(idx,itm){
$('.catitems').append(itm);
});
});
</script> |