Форум

klubnichkaaa · #1 (**permalink**) 13.10.2011, 12:06

Здравствуйте! Есть вопрос о том как можно сделать следующую вещь. Есть к примеру 2 текстовых поля, с разными id, и при нажатии на картинку число в текстовом поле увеличивается или уменьшается на 1. Есть функция которая это исполняет вопрос в том как сделать независимым подсчёт каждого поля. Ниже пример.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<script src="../script.js"></script>
<body>
<!---->
<!--Картинка увеличивает на 1-->
<img src="col1.JPEG" onclick="col1('1')" width="20px">
<br>
<!--Поле в котором нужно изменить знаение-->
<input type="text" id="3" value="1" size="7">
<br>
<!--Картинка которая уменьшает значение на 1-->
<img src="col2.JPEG" onclick="col2()" width="20px">

<br><br>

<!--А это второе поле вот нужно что бы оно работало независимо от второго и таких полей может быть сколько угодно-->
<img src="col1.JPEG" onclick="col1()" width="20px">
<br>
<input type="text" id="2" value="1" size="7">
<br>
<img src="col2.JPEG" onclick="col2()" width="20px">

</body>
</html>

Теперь сам скрипт он рабочий, но нужно модифицировать.

//Функция которая увеличивает
//Как я вижу решение нужно Подставить значение в function col1(Значение из onclick="col1(1)"){
function col1(){
var n=1;
var rr=А тут проверить onclick="col1(1)" равно одному или любому другому значению да равно делаем подсчёт
for(var i=1; i<5; i++){
if(rr==n){
var col=document.getElementById('3').value;
col++;
document.getElementById('3').value = col;


}

n++;
}
}

function col2(){
var col=document.getElementById('col').value;
col--;
if(col==0){

}
else{
document.getElementById('col').value = col;
}
}

Тоесть нужно как то вызвать onclick="col1(Со значением 1)" и подставить в значение функции, и затем сделать проверку if что равно еденице onclick="col1(1)" или нет скажи такое возможно!? или мои мысли не правильны!?

klubnichkaaa · #2 (**permalink**) 13.10.2011, 14:11

Если долго мучаться что нибудь получится сделал я код тестовый и он заработал урааа!
Сделал я так как и описывал может кому пригодится.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<script src="../script.js"></script>
<body>
<!---->
<!--Картинка увеличивает на 1-->
<img src="col1.JPEG" onclick="col1(1)" width="20px">
<br>
<!--Поле в котором нужно изменить знаение-->
<input type="text" id="1" value="1" size="7">
<br>
<!--Картинка которая уменьшает значение на 1-->
<img src="col2.JPEG" onclick="col2(1)" width="20px">

<br><br>

<!--А это второе поле вот нужно что бы оно работало независимо от второго и таких полей может быть сколько угодно-->
<img src="col1.JPEG" onclick="col1(2)" width="20px">
<br>
<input type="text" id="2" value="1" size="7">
<br>
<img src="col2.JPEG" onclick="col2(2)" width="20px">

</body>
</html>

Теперь код исполнения

function col1(elem){
var n=0;

for(var i=1; i<7; i++){
var rr=document.getElementById(elem).id;
if(rr==n){
var col=document.getElementById(elem).value;
col++;
document.getElementById(elem).value = col;


}

n++;
}
}

function col2(elem){
var n=0;

for(var i=1; i<7; i++){
var rr=document.getElementById(elem).id;
if(rr==n){
var col=document.getElementById(elem).value;
col--;
document.getElementById(elem).value = col;


}

n++;
}
}

С помощью function col1(elem) мы получаем значение elem - это onclick="col1(1)" значение 1. дальше нужно мне было сделать проверку
var rr=document.getElementById(elem).id;
Опять же elem это значение которое равно 1, 2 и так далее а .id это мы получаем значение не value а id что он содержит
if(rr==n){ тут я проверяю и пишу сценарий. Вот и всё. Это может пригодиться не только для подсчёта но и для других случаев.

Форум

Справочник

Discord чат

Курсы javascript