input value and calculation, _html/css_WEB-ITnose

This post was last edited by erbao_vip on 2013-11-06 13:14:13

html jsp

My input:

<td>						${g.newPrice}<input type="hidden" class="oneprice" value="${g.newPrice}">						</td>						<td><input type="button" value=" - "							size="3" class="l_i" id="lost"> 														 <input value="1"							size="2" id="number" maxlength="2" name="buynumbers"							class="number"							onkeyup="this.value=this.value.replace(/[^\d]/g,'') "> 																												<input type="button" value=" + " size="3" id="add" class="a_i">													</td>						<td><input value="${g.newPrice}"							id="all" class="all" name="totalprice_one" readonly="readonly"							disabled="disabled"></td>						<td>

The jsp page displays:
I want to click the - button to change the quantity and the value of the subtotal. One is easy to implement, but how to implement multiple? Look at the picture,

Reply to the discussion (solution)

My input:

<td>						${g.newPrice}<input type="hidden" class="oneprice" value="${g.newPrice}">						</td>						<td><input type="button" value=" - "							size="3" class="l_i" id="lost"> 														 <input value="1"							size="2" id="number" maxlength="2" name="buynumbers"							class="number"							onkeyup="this.value=this.value.replace(/[^\d]/g,'') "> 																												<input type="button" value=" + " size="3" id="add" class="a_i">													</td>						<td><input value="${g.newPrice}"							id="all" class="all" name="totalprice_one" readonly="readonly"							disabled="disabled"></td>						<td>

The jsp page displays:
I want to click ,-button, change the quantity, and change the value of the subtotal. One is easy to implement, but how to implement multiple ones? Look at the picture, how to implement one, how to implement multiple, post the code of your implementation

You can do this, when printing, give an id for each line
Then the first line can is 0, then the id of the input box in the first line is input_0
Write a method

<table>			<tr>				<td>					<input type="button" value="+" onclick="show_num('input_0',this)"/>				</td>				<td>					<input type="text" value="1" id="input_0"/>				</td>				<td>					<input type="button" value="-" onclick="show_num('input_0',this)"/>				</td>			</tr>			<tr>				<td>					<input type="button" value="+" onclick="show_num('input_1',this)"/>				</td>				<td>					<input type="text" value="1" id="input_1"/>				</td>				<td>					<input type="button" value="-" onclick="show_num('input_1',this)"/>				</td>			</tr>			<tr>				<td>					<input type="button" value="+" onclick="show_num('input_2',this)"/>				</td>				<td>					<input type="text" value="1" id="input_2"/>				</td>				<td>					<input type="button" value="-" onclick="show_num('input_2',this)"/>				</td>			</tr>		</table>function show_num(input_id,item){				var target=document.getElementById(input_id);				var sign=item.value;				console.log(sign);				var val=parseInt(target.value);				if(sign=="+"){					val=val+1;				}else{					val=(val-1)>0?(val-1):0;				}				target.value=val;			}

Code: I used to use Id to get the value, but now I changed it To get the value using class:

if ($("#number").val() == 1) {		$("#lost").attr("disabled", "disabled");	}	$("#add").click(function() {		var n = $("#number").val();		n = n - 0 + 1;		// alert(n);		if (n > 0) {			// .attr("disabled",false); //disabled="disabled"			$("#lost").attr("disabled", false);		}		$("#number").val(n);		$("#all").val($("#oneprice").val() * n);	});	$("#lost").click(function() {		var n = $("#number").val();		n = n - 1;		// alert(n);		if (n == 1 || n == 0) {			// .attr("disabled",false); //disabled="disabled"			$("#lost").attr("disabled", "disabled");		}		$("#number").val(n);		$("#all").val($("#oneprice").val() * n);	});	// keyup	$("#number").keyup(function() {		n = $("#number").val();		if (n <= 0) {			// $("#lost").attr("disabled", "disabled");			$("#number").val(1);			$("#all").val($("#oneprice").val());		}		if (n > 0) {			$("#lost").attr("disabled", false);			$("#all").val($("#oneprice").val() * n);		}	});