Versuchen, ein Formular mit 2 "Menge" Selektoren mit HTML, Javascript

erstellen Ich versuche, eine Menge Selektor wie das, was Sie in einem Lebensmittelgeschäft Website oder in den meisten E-Commerce-Websites finden würde. (Eins mit den Tasten +1 und -1) Ich kann den ersten Selektor funktionieren lassen, aber den zweiten nicht bekommen.Versuchen, ein Formular mit 2 "Menge" Selektoren mit HTML, Javascript

Hier ist der Code und HTML Ich habe bisher:

function addNum1() { 
 
    var newValue = Number(ordernow.firstvalue.value); 
 
    newValue +=1; 
 
    ordernow.firstvalue.value = newValue; 
 
} 
 

 
function minusNum1() { 
 
    var subNum = Number(ordernow.firstvalue.value); 
 
    if (subNum > 0) { 
 
    subNum -= 1; 
 
    ordernow.firstvalue.value = subNum; 
 
    } 
 
} 
 
function addNum2() { 
 
    var newValue = Number(ordernow.firstvalue2.value); 
 
    newValue2 +=1; 
 
    ordernow.firstvalue2.value = newValue2; 
 
} 
 

 
function minusNum2() { 
 
    var subNum2 = Number(ordernow.firstvalue2.value); 
 
    if (subNum2 > 0) { 
 
    subNum2 -= 1; 
 
    ordernow.firstvalue2.value = subNum2; 
 
    } 
 
};

<body> 
 
    <div class=container> 
 
    <form name="orderup" id="ordernow"> 
 
     <p> Chicken &nbsp &nbsp $4.57</p> 
 
     Quantity<input type="button" id="firstminus" value="- 1"  onclick="minusNum1()"/> 
 
     <input type="text" id="firstvalue" value="0"/> 
 
     <input type="button" id="firstadd" value="+1" onclick="addNum1()"/> 
 
     <p> Beef &nbsp &nbsp $3.32</p> 
 
     Quantity<input type="button" id="firstminus2" value="- 1" onclick="minusNum2()"/> 
 
     <input type="text" id="firstvalue2" value="0"/> 
 
     <input type="button" id="firstadd2" value="+1" onclick="addNum2()"/> 
 
    </form> 
 
    </div> 
 
</body>

Quelle

2016-04-08 alanb

Erstellen Sie eine [Geige] (http://jsfiddle.net) oder einen Codepen oder usw. und fügen Sie einen Link zu Ihrer Frage hinzu. Was Sie in Ihrer Frage haben, ist unvollständig und ungültig. –

Oder ein SO-Code-Snippet. Es kommt ... Warte auf die Bearbeitungsgenehmigung. – LinuxDisciple

Wenn Sie Ihren Browser-Entwicklungstools die Konsole öffnen sollte eine Fehlermeldung an. Auf Chrome erhalte ich:
Uncaught ReferenceError: newValue2 is not defined

Dies liegt daran, addNum2()newValue erklärt aber dann verwendet newValue2 in der nächsten Zeile.

function addNum2() { 
    var newValue = Number(ordernow.firstvalue2.value); 
    newValue2 +=1; 
    ordernow.firstvalue2.value = newValue2; 
}

var newValue = Number (ordernow.firstvalue2.value);
newValue2 + = 1;

Sie können den gleichen Variablennamen verwenden, da Sie sich in einem anderen Funktionsumfang befinden.
Fix:

function addNum2() { 
    var newValue = Number(ordernow.firstvalue2.value); 
    newValue +=1; 
    ordernow.firstvalue2.value = newValue; 
}

Überprüfen Sie immer auf Fehlermeldungen in der Konsole und Javascript in dem Debugger ausgeführt wird, wenn etwas Arbeit ist „geheimnisvoll“ nicht.

Quelle

2016-04-08 22:39:39

Vielen Dank, Stephen P !!! – alanb

Versuchen, ein Formular mit 2 "Menge" Selektoren mit HTML, Javascript

Antwort

Verwandte Themen