передача значения из input "value" в div "id"
Схема такая:
Есть ссылка <a> которая по клику записывает значения своего id в куки с разделителем "-" а именно название, цену и количество. Нужно сделать так, чтоб количество определял пользователь с помощью <input> значения value. То есть цифра из <input value> должна попасть в конец <a id> вместо еденицы (1 штука по умолчанию). было: product1-price100-1 должно быть: product1-price100-2 Логически получился следующий код, который так и не заработал :( Что нужно изменить для успешного выполнения? HTML: <div class='add'><a id='product1-price100-1' class='addCart'></a> <input class='addCopies' value='2'></div> <div class='add'><a id='product2-price100-1' class='addCart'></a> <input class='addCopies' value='2'></div> jQuery:
$(document).ready(function(){
$('div.add').each( //для каждого блока со стилем .add
var div = $(this);
var a = $(div).('a');
var i = $(div).('input');
var value = $(i).val(); //берём значение input value
var a_id = $(a).attr('id'); //смотрим значение a id
var arr = a_id.split('-'); //парсим a id по дефису
var new_id = arr[0] + arr[1] + "-" + value; //добавляем новое значение
$(a).attr('id',new_id);//заменяем id на новое
);
});
|
Поправил ошибки
$(document).ready(function(){
$('div.add').each(function(){ //для каждого блока со стилем .add
var div = $(this);
var a = $(div).children('a');
var i = $(div).children('input');
var value = $(i).val(); //берём значение input value
var a_id = $(a).attr('id'); //смотрим значение a id
var arr = a_id.split('-'); //парсим a id по дефису
var new_id = arr[0] + arr[1] + "-" + value; //добавляем новое значение
$(a).attr('id',new_id);//заменяем id на новое
});
});
|
спасибо, действительно ночная оплошность ))
теоритически всё логично, но на практике пример всё равно не заработал.. |
А где, собственно, указание на то, что действие должно выполняться по клику? Может, $('div.add').click?
Много лишних долларов в коде. jQuery-селектор возвращает jQuery-массив, его нет смысла потом оборачивать в лишний $ - мы ведь нигде не обращаемся к отдельному элементу этого массива.
var div = $(this);
var a = div.children('a');
var i = div.children('input');
var value = i.val(); //берём значение input value
var a_id = a.attr('id'); //смотрим значение a id
Доллары имеют смысл, только если делать вот так:
var div = $(this);
var i = div.children('input')*!*[0]*/!*;
var value = *!*$(i)*/!*.val(); //i - не jQuery, a HTMLElement
Но ещё правильнее в этом случае переписать по-другому:
var div = $(this);
var i = div.children('input')*!*.eq(0)*/!*;
var value = *!*i*/!*.val(); //i - jQuery
|
Sanda
действие происходит по клику на <a class='addCart'> - я хотел чтоб значение передавалось сразу после ввода в <input>, но Вы вероятно правы, нужно по клику. |
Не важно, как именно передавать - по клику, по вводу. Важно указать в коде метод передачи (: В представленном куске его просто нет. На document.ready однократно выполняется некое действие, но никаких указаний на то, что это же действие нужно выполнять ещё раз, нет.
|
о, в какую сторону двигаться понял, спасибо )
|
Повторюсь - вместо $('div.add').each поставь $('div.add').click. Ну и исправления Serg_pnz не забудь добавить. Не самый правильный вариант реализации, конечно, но работать должен.
|
Попутно input заменил на select, а родительский div на p.
Решение проблемы 1: В строке 8 нужно было не просто указать значение value, а указать, что оно добавляется к уже имеющемуся id! было: '-' + 'value' стало: 'id' + '-' + 'value' Решение проблемы 2: Для элемента <select> нужен не .click() а .change() ! С этим кодом заработало:
$(document).ready(function(){
$('#products p').change(function(){
var p = $(this);
var a = p.children('a');
var s = p.children('select').eq(0);
var value = s.val();
var a_id = a.attr('id');
var arr = a_id.split('id' + '-');
var new_id = arr[0] + arr[1] + '-' + value;
$(a).attr('id', new_id);
});
});
|
| Часовой пояс GMT +3, время: 20:19. |