javascript - AddSubtract Click Function - Stack Overflow

admin管理员组

文章数量:1024581

Can anyone modify this code to [Add by left clicking the number], and [Subtract by right clicking the number]?

This would get rid of the + and - buttons.

I can't figure out how to do it.

DEMO

HTML

<input id="txtNumber" type=text" value="55" style="width:30px" />
<input id="btnAdd" type="button" value="+" onclick="add();" />
<input id="btnSubtract" type="button" value="-" onclick="subtract();" />

Javascript

function add()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) + 1;
  txtNumber.value = newNumber;
}

function subtract()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) - 1;
  txtNumber.value = newNumber;
}

Can anyone modify this code to [Add by left clicking the number], and [Subtract by right clicking the number]?

This would get rid of the + and - buttons.

I can't figure out how to do it.

DEMO

HTML

<input id="txtNumber" type=text" value="55" style="width:30px" />
<input id="btnAdd" type="button" value="+" onclick="add();" />
<input id="btnSubtract" type="button" value="-" onclick="subtract();" />

Javascript

function add()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) + 1;
  txtNumber.value = newNumber;
}

function subtract()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) - 1;
  txtNumber.value = newNumber;
}

• javascript
• jquery
• function
• jsfiddle
• jscript

Share Improve this question Follow edited Jan 12, 2014 at 5:27 tshepang 12.5k2525 gold badges9898 silver badges139139 bronze badges asked Oct 10, 2013 at 21:52 user2811882user2811882 6711 gold badge22 silver badges88 bronze badges 3

• Distinguish between left and right click: stackoverflow./a/2725963/2812842 – scrowler Commented Oct 10, 2013 at 21:56
• Your code seems to work if i return false rather than passing an event param to your context event. jsbin./oxeyeb/61 Edit: oh.... that's not what you originally had i guess. i hate jsbin for that.. can you include your original code in question?. – Kevin B Commented Oct 10, 2013 at 22:03
• Unlike forum sites, we don't use "Thanks", or "Any help appreciated", or signatures on Stack Overflow. See "Should 'Hi', 'thanks,' taglines, and salutations be removed from posts?. – John Saunders Commented Oct 13, 2013 at 1:42

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 1

This is a good way to do it:

http://jsbin./irIwUNi/2/edit

HTML

<input id="txtNumber" type=text" value="55" 
  style="width:30px" onclick="javascript:add()" 
  oncontextmenu="javascript:subtract(event)" />

Javascript

function add()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) + 1;
  txtNumber.value = newNumber;
}

function subtract(e)
{
  e.preventDefault();
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) - 1;
  txtNumber.value = newNumber;
  return false;
}

If you just set add() to run on click and subtract() to run on right click (when the context menu would e up), you can capture the click types you want. Then just pass in event to subtract() and stop it from doing what it would normally do, i.e. bring up the context menu.

Can anyone modify this code to [Add by left clicking the number], and [Subtract by right clicking the number]?

This would get rid of the + and - buttons.

I can't figure out how to do it.

DEMO

HTML

<input id="txtNumber" type=text" value="55" style="width:30px" />
<input id="btnAdd" type="button" value="+" onclick="add();" />
<input id="btnSubtract" type="button" value="-" onclick="subtract();" />

Javascript

function add()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) + 1;
  txtNumber.value = newNumber;
}

function subtract()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) - 1;
  txtNumber.value = newNumber;
}

Can anyone modify this code to [Add by left clicking the number], and [Subtract by right clicking the number]?

This would get rid of the + and - buttons.

I can't figure out how to do it.

DEMO

HTML

<input id="txtNumber" type=text" value="55" style="width:30px" />
<input id="btnAdd" type="button" value="+" onclick="add();" />
<input id="btnSubtract" type="button" value="-" onclick="subtract();" />

Javascript

function add()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) + 1;
  txtNumber.value = newNumber;
}

function subtract()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) - 1;
  txtNumber.value = newNumber;
}

• javascript
• jquery
• function
• jsfiddle
• jscript

Share Improve this question Follow edited Jan 12, 2014 at 5:27 tshepang 12.5k2525 gold badges9898 silver badges139139 bronze badges asked Oct 10, 2013 at 21:52 user2811882user2811882 6711 gold badge22 silver badges88 bronze badges 3

• Distinguish between left and right click: stackoverflow./a/2725963/2812842 – scrowler Commented Oct 10, 2013 at 21:56
• Your code seems to work if i return false rather than passing an event param to your context event. jsbin./oxeyeb/61 Edit: oh.... that's not what you originally had i guess. i hate jsbin for that.. can you include your original code in question?. – Kevin B Commented Oct 10, 2013 at 22:03
• Unlike forum sites, we don't use "Thanks", or "Any help appreciated", or signatures on Stack Overflow. See "Should 'Hi', 'thanks,' taglines, and salutations be removed from posts?. – John Saunders Commented Oct 13, 2013 at 1:42

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 1

This is a good way to do it:

http://jsbin./irIwUNi/2/edit

HTML

<input id="txtNumber" type=text" value="55" 
  style="width:30px" onclick="javascript:add()" 
  oncontextmenu="javascript:subtract(event)" />

Javascript

function add()
{
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) + 1;
  txtNumber.value = newNumber;
}

function subtract(e)
{
  e.preventDefault();
  var txtNumber = document.getElementById("txtNumber");
  var newNumber = parseInt(txtNumber.value) - 1;
  txtNumber.value = newNumber;
  return false;
}

If you just set add() to run on click and subtract() to run on right click (when the context menu would e up), you can capture the click types you want. Then just pass in event to subtract() and stop it from doing what it would normally do, i.e. bring up the context menu.

本文标签： javascriptAddSubtract Click FunctionStack Overflow