Увеличение количества
Всем привет )
Есть форма с текстовым полем и кнопкой увеличения значения поля на 1:
<form>
<input type="text" size="5" value="1" />
<input type="button" onclick="add(this)" value="+" />
</form>
И сам js код:
function add(element){
element.parentNode.getElementsByTagName('input')[0].value = parseInt(element.parentNode.getElementsByTagName('input')[0].value) + 1;
}
Подскажите, есть ли более изящное решение и что можно поправить в этой функции? |
<input type="text" id="inp" size="5" value="1">
<input type="button" value="+"
onclick="
inp.value = parseInt(inp.value) + 1
">
|
Нет, это совсем не то, id у поля отсутствует.
Возможно добавление id к родителю, но при этом потомки будут анологичными, т.е. что то вроде этого:
<div id="parent">
<form>
<input type="text" size="5" value="1" />
<input type="button" onclick="add(this)" value="+" />
</form>
...
<form>
<input type="text" size="5" value="1" />
<input type="button" onclick="add(this)" value="+" />
</form>
</div>
|
Цитата:
Цитата:
Не очень-то понятно чего вы хотите добиться, если ваша функция делает то же самое, что и у меня обработчик onclick. Так лучше??
<div id="myDiv">
<input type="text" size="5" value="1">
<input type="button" value="+"
onclick="
myDiv.children[0].value = parseInt(myDiv.children[0].value) + 1
">
</div>
|
Элементов с формой на странице может быть довольно много и наверное правильнее написать один раз функцию, чем повторять весь этот код в событии. Как раз id тем же и плох, то что как то неразумно задавать к примеру 100 элементам разные id. По классу же слишком сложная выборка, поэтому и приходится извращаться с DOM деревом и фунцией.
Цитата:
|
Цитата:
<div id="myDiv"
onclick = "
var a = this.getElementsByTagName('input');
var e = event.srcElement || event.target;
if (e.type == 'button') {
for (i=0; i<a.length; i++) {
if (a[i] == e) {
a[i-1].value = parseInt(a[i-1].value) + 1;
break;
}
}
}
">
<input type="text" size="5" value="1">
<input type="button" value="+">
<input type="text" size="5" value="1">
<input type="button" value="+">
</div>
<!--для этого не сработает, так как он вне div-->
<input type="text" size="5" value="1">
<input type="button" value="+">
Если хотите вынесите код обработчика в функцию. |
Цитата:
к примеру, могу увеличить поле до 5, а уменьшить только до 1 |
Цитата:
<input type="text" id="inp" size="5" value="1">
<input type="button" value="+"
onclick="
inp.value = parseInt(inp.value) >= 5 ? '5' : (parseInt(inp.value) < 1 ? '1' : parseInt(inp.value) + 1)
">
осталось только сделать вторую кнопку и присобачить к ней соответствующее условие для уменьшения значения |
Цитата:
(parseInt(inp.value) <= 1 ? '1' при < 1 минусует не правильно. сперва уменьшается до нуля, потом единица |
Цитата:
<img src="-.jpg" class="onclick" onclick="inp.value = parseInt(inp.value) <= 1 ? '1' : parseInt(inp.value) - 1"/> или оформите в виде функции и передавайте туда в качестве параметров пороги (1,5 или др...) |
| Часовой пояс GMT +3, время: 03:11. |