Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.07.2011, 14:27
Аватар для spo
spo spo вне форума
Профессор
Отправить личное сообщение для spo Посмотреть профиль Найти все сообщения от spo
 
Регистрация: 11.05.2011
Сообщений: 213

Увеличить / уменьшить значение value у input
В разделе "корзина" добавленные товары выводятся в таблице.
Напротив каждого товара есть поле (input) в котором отображается количество товаров конкретного наименования. Данные изначально принимают значение 1, могут вписываться вручную, а так же увеличиваться (+) либо уменьшаться (-).

<table>
	<tr>
		<td>
			<a class="minus" href="#">-</a>
			<input type="text" value="1" />
			<a class="plus" href="#">+</a>
		</td>
		<td>
			<a class="minus" href="#">-</a>
			<input type="text" value="1" />
			<a class="plus" href="#">+</a>
		</td>
	</tr>
</table>


Я не силен в jquery но смог написать код который работает для всех полей input одновременно.

$(function() {
	$('input').each(function() {
		
		$('a.minus').click(function() {
			var data = $('input.amount').val();
			if(data > 0) {
				$('input.amount').val(parseInt(data) - 1);
			}
			return false
		});
		
		$('a.plus').click(function() {
			var data = $('input.amount').val();
			$('input.amount').val(parseInt(data) + 1);
			return false
		});
		
	});
});


Мне же нужно чтобы для каждого значения менялись отдельно.

Я пробовал через each, но так и не смог справиться. Раньше делал аналогичные задания, но сейчас почемуто не выходит.

Помогите пожалуйста.
Ответить с цитированием
  #2 (permalink)  
Старый 16.07.2011, 14:32
Аватар для spo
spo spo вне форума
Профессор
Отправить личное сообщение для spo Посмотреть профиль Найти все сообщения от spo
 
Регистрация: 11.05.2011
Сообщений: 213

Справился

$(function() {
	$('td').each(function() {
		
		var asd = $(this);
		
		asd.find('a.minus').click(function() {
			var data = asd.find('input').val();
			if(data > 0) {
				asd.find('input').val(parseInt(data) - 1);
			}
			return false
		});
		
		asd.find('a.plus').click(function() {
			var data = asd.find('input').val();
			asd.find('input').val(parseInt(data) + 1);
			return false
		});
		
	});
});
Ответить с цитированием
  #3 (permalink)  
Старый 16.07.2011, 14:36
Профессор
Отправить личное сообщение для nikita.mmf Посмотреть профиль Найти все сообщения от nikita.mmf
 
Регистрация: 01.02.2010
Сообщений: 364

$(function() {
	$('input').each(function() {
		var $input = $(this);
		$input.prev('a.minus').click(function() {
		    $input.val ( Math.max( parseInt( $input.val() )--, 0 ) );
     		    return false;
		});
		
		$input.next('a.plus', this.parentNode).click(function() {
		    $input.val ( parseInt( $input.val() )++ );
		    return false;
		});
		
	});
});
Ответить с цитированием
  #4 (permalink)  
Старый 16.07.2011, 14:53
Аватар для spo
spo spo вне форума
Профессор
Отправить личное сообщение для spo Посмотреть профиль Найти все сообщения от spo
 
Регистрация: 11.05.2011
Сообщений: 213

Подскажите как решить вопрос с вводом текстовых данных и отрицательных чисел? Пока сделал disabled тем самым ограничив ввод данных с клавиатуры, но хотелось бы чтобы пользователь мог вводить сам количество.
Ответить с цитированием
  #5 (permalink)  
Старый 16.07.2011, 15:08
Аватар для spo
spo spo вне форума
Профессор
Отправить личное сообщение для spo Посмотреть профиль Найти все сообщения от spo
 
Регистрация: 11.05.2011
Сообщений: 213

Справился

$("input").keydown(function(event) {
	// Allow only backspace and delete
	if ( event.keyCode == 46 || event.keyCode == 8 ) {
		// let it happen, don't do anything
	}
	else {
		// Ensure that it is a number and stop the keypress
		if (event.keyCode < 48 || event.keyCode > 57 ) {
			event.preventDefault();	
		}	
	}
});
Ответить с цитированием
  #6 (permalink)  
Старый 16.07.2011, 15:14
Аватар для trikadin
Модератор
Отправить личное сообщение для trikadin Посмотреть профиль Найти все сообщения от trikadin
 
Регистрация: 27.04.2010
Сообщений: 3,417

<script>
function check_symbol(event) {
 event= event || window.event;
 if ((event.keyCode > 57 || event.keyCode <48) && (event.keyCode<35 || event.keyCode>39) && event.keyCode!=8)
  return false;
}
</script>
<input onkeydown="return check_symbol(event)">



А ваш вариант не позволит мне стирать введённые цифры и перемещаться по ним стрелками.
__________________
Читайте:
Ты любопытный) Всё-таки, ничему в этом мире не помешает хорошая доля юмора)
Как спросить, чтобы вам ответили
Часто Задаваемые Вопросы (FAQ)

Последний раз редактировалось trikadin, 16.07.2011 в 15:23.
Ответить с цитированием
  #7 (permalink)  
Старый 28.01.2014, 22:25
Новичок на форуме
Отправить личное сообщение для Kerya Посмотреть профиль Найти все сообщения от Kerya
 
Регистрация: 27.01.2014
Сообщений: 2

как сделать увеличение на 1
<div class="opt-quontity">
    <span class="minus">-</span>
    
<input type="text" title="<?php echo  JText::_('COM_VIRTUEMART_CART_UPDATE') ?>" class="inputbox input-ultra-mini" size="3" maxlength="4" name="quantity" value="<?php echo $prow->quantity ?>" data-vpid="<?php echo $prow->cart_item_id  ?>" />
    <span class="plus">+</span>
</div> <!-- .opt-quontity -->             

<script type="text/javascript" >
jQuery(document).ready(function($) {
        $(document).ready(function() {
            $('.minus').click(function () {
				
                var $input = $(this).parent().find('input');
                var count = parseInt($input.val()) - 1;
                count = count < 1 ? 1 : count;
                $input.val(count);
                $input.change();
                return false;
             });
             $('.plus').click(function () {
                var $input = $(this).parent().find('input');
                $input.val(parseInt($input.val()) + 1);
                $input.change();
                return false;
            });
        });
		
		 });
    </script>


в корзине увеличивает на количество товаров если 1 товар, то увеличивает input на 1, а если 2 то на 2 единицы...
Ответить с цитированием
  #8 (permalink)  
Старый 29.01.2014, 00:00
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

Vanilla JS
http://jsfiddle.net/vlasenkofedor/UFmLf/
Ответить с цитированием
  #9 (permalink)  
Старый 29.01.2014, 01:24
Новичок на форуме
Отправить личное сообщение для Kerya Посмотреть профиль Найти все сообщения от Kerya
 
Регистрация: 27.01.2014
Сообщений: 2

как подключить этот скрипт, подключил но интпутов стало в 2 раза больше)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как вытощить значение из input? Joshka Элементы интерфейса 12 19.06.2011 12:15
установить значение в input относительно select-та gudzik Общие вопросы Javascript 9 26.10.2010 17:02
Как добавить значение в input type="file"? PAMAC Общие вопросы Javascript 2 01.04.2010 19:59
Функция меняющая значение input type text. Value не подходит( Sundog Общие вопросы Javascript 1 25.09.2009 15:06
Не считывается значение с поля input Tinvul jQuery 7 19.09.2009 19:03