Subtract amount automaticaly from input

-5

Using jquery, how to auto subtracting amount from input after typing it without button
Ex. When I type a number in an input , I want to subtract it -5 after I leave it automaticaly without submit button , 200 will be 195 .
Is it posible?

asked Nov 20 at 18:33

Gamal Elwazeery

517

2

Yes that's possible.
– justDan
Nov 20 at 18:35

2

use on change api.jquery.com/change
– XTOTHEL
Nov 20 at 18:35

@justDan's comment + try at least once
– Nikhil Vartak
Nov 20 at 18:36

You're fairly new, so folks should go kind of easy on you. What have you tried? Have you run into a wall as far as your coding goes? That's what we're here for. General questions will get down voted...
– Snowmonkey
Nov 20 at 18:37

@Snowmonkey I don't know is it posible to do it in jquery or not :(
– Gamal Elwazeery
Nov 20 at 18:39

|
show 1 more comment

-5

asked Nov 20 at 18:33

Gamal Elwazeery

517

2

Yes that's possible.
– justDan
Nov 20 at 18:35

2

use on change api.jquery.com/change
– XTOTHEL
Nov 20 at 18:35

@justDan's comment + try at least once
– Nikhil Vartak
Nov 20 at 18:36

You're fairly new, so folks should go kind of easy on you. What have you tried? Have you run into a wall as far as your coding goes? That's what we're here for. General questions will get down voted...
– Snowmonkey
Nov 20 at 18:37

@Snowmonkey I don't know is it posible to do it in jquery or not :(
– Gamal Elwazeery
Nov 20 at 18:39

|
show 1 more comment

-5

asked Nov 20 at 18:33

Gamal Elwazeery

517

javascript jquery

asked Nov 20 at 18:33

Gamal Elwazeery

517

asked Nov 20 at 18:33

Gamal Elwazeery

517

asked Nov 20 at 18:33

Gamal Elwazeery

517

asked Nov 20 at 18:33

Gamal Elwazeery

517

asked Nov 20 at 18:33

Gamal Elwazeery

517

2

Yes that's possible.
– justDan
Nov 20 at 18:35

2

use on change api.jquery.com/change
– XTOTHEL
Nov 20 at 18:35

@justDan's comment + try at least once
– Nikhil Vartak
Nov 20 at 18:36

You're fairly new, so folks should go kind of easy on you. What have you tried? Have you run into a wall as far as your coding goes? That's what we're here for. General questions will get down voted...
– Snowmonkey
Nov 20 at 18:37

@Snowmonkey I don't know is it posible to do it in jquery or not :(
– Gamal Elwazeery
Nov 20 at 18:39

|
show 1 more comment

2

Yes that's possible.
– justDan
Nov 20 at 18:35

2

use on change api.jquery.com/change
– XTOTHEL
Nov 20 at 18:35

@justDan's comment + try at least once
– Nikhil Vartak
Nov 20 at 18:36

You're fairly new, so folks should go kind of easy on you. What have you tried? Have you run into a wall as far as your coding goes? That's what we're here for. General questions will get down voted...
– Snowmonkey
Nov 20 at 18:37

@Snowmonkey I don't know is it posible to do it in jquery or not :(
– Gamal Elwazeery
Nov 20 at 18:39

Yes that's possible.
– justDan
Nov 20 at 18:35

use on change api.jquery.com/change
– XTOTHEL
Nov 20 at 18:35

@justDan's comment + try at least once
– Nikhil Vartak
Nov 20 at 18:36

You're fairly new, so folks should go kind of easy on you. What have you tried? Have you run into a wall as far as your coding goes? That's what we're here for. General questions will get down voted...
– Snowmonkey
Nov 20 at 18:37

@Snowmonkey I don't know is it posible to do it in jquery or not :(
– Gamal Elwazeery
Nov 20 at 18:39

|
show 1 more comment

4 Answers
4

active

oldest

votes

Ok here's a quick way to do this in jquery. Try the code below. Add a number and tab off the input or click out of it and the value will change.

$('input').on('blur', function() {

  var num = $(this).val() - 5;

  $(this).val(num);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text">

answered Nov 20 at 18:46

justDan

1,0991718

add a comment |

EDIT: In case you are looking for a pure JavaScript alternative (without jQuery):

You can attach this process to an input event such as onkeyup or onfocusout:

function update() {

  amount = document.getElementById("amount");

  amount.value = parseInt(amount.value) - 5;

}

<input type="text" id="amount" onfocusout="update()">

edited Nov 20 at 18:53

answered Nov 20 at 18:44

João Eduardo

11517

The OP is actually asking for jQuery solution if I am not missing something.
– Vitaliy Terziev
Nov 20 at 18:46

Ops, my mistake!! Well, as someone already posted a corrected answer using jQuery I will edit the answer as a pure JavaScript alternative. Thanks for pointing out!!
– João Eduardo
Nov 20 at 18:50

add a comment |

JavaSript solution.
This will work for you.

document.getElementById("input").onblur = substract;



function substract() {

  let firstValue = event.currentTarget.value;

  let finalValue = Number(firstValue) - 5;

  document.getElementById("input").value = finalValue;

}

answered Nov 20 at 18:50

user18984

375

add a comment |

To do this you need need to create a function and attach the input Element to the function.

Creating a function to reduce input element on change by 5.

var myfunction = function(){

      var value = parseInt(this.value);

     //check if input is of type int and less than five to avoid negative numbers.

     if( !value || value < 5 ){

          return false;

      }

     this.value = value - 5;

 };



 //ataching function to the element

var element = document.getElementById('my_input');

element.addEventListener( 'change', myfunction, false );

answered Nov 20 at 18:52

Edwin Dijas Chiwona

34118

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53399375%2fsubtract-amount-automaticaly-from-input%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

4 Answers
4

active

oldest

votes

4 Answers
4

active

oldest

votes

Ok here's a quick way to do this in jquery. Try the code below. Add a number and tab off the input or click out of it and the value will change.

$('input').on('blur', function() {

  var num = $(this).val() - 5;

  $(this).val(num);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text">

answered Nov 20 at 18:46

justDan

1,0991718

add a comment |

Ok here's a quick way to do this in jquery. Try the code below. Add a number and tab off the input or click out of it and the value will change.

$('input').on('blur', function() {

  var num = $(this).val() - 5;

  $(this).val(num);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text">

answered Nov 20 at 18:46

justDan

1,0991718

add a comment |

Ok here's a quick way to do this in jquery. Try the code below. Add a number and tab off the input or click out of it and the value will change.

$('input').on('blur', function() {

  var num = $(this).val() - 5;

  $(this).val(num);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text">

answered Nov 20 at 18:46

justDan

1,0991718

Ok here's a quick way to do this in jquery. Try the code below. Add a number and tab off the input or click out of it and the value will change.

$('input').on('blur', function() {

  var num = $(this).val() - 5;

  $(this).val(num);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text">

$('input').on('blur', function() {

  var num = $(this).val() - 5;

  $(this).val(num);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text">

$('input').on('blur', function() {

  var num = $(this).val() - 5;

  $(this).val(num);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text">

answered Nov 20 at 18:46

justDan

1,0991718

answered Nov 20 at 18:46

justDan

1,0991718

answered Nov 20 at 18:46

justDan

1,0991718

answered Nov 20 at 18:46

justDan

1,0991718

add a comment |

EDIT: In case you are looking for a pure JavaScript alternative (without jQuery):

You can attach this process to an input event such as onkeyup or onfocusout:

function update() {

  amount = document.getElementById("amount");

  amount.value = parseInt(amount.value) - 5;

}

<input type="text" id="amount" onfocusout="update()">

edited Nov 20 at 18:53

answered Nov 20 at 18:44

João Eduardo

11517

The OP is actually asking for jQuery solution if I am not missing something.
– Vitaliy Terziev
Nov 20 at 18:46

Ops, my mistake!! Well, as someone already posted a corrected answer using jQuery I will edit the answer as a pure JavaScript alternative. Thanks for pointing out!!
– João Eduardo
Nov 20 at 18:50

add a comment |

EDIT: In case you are looking for a pure JavaScript alternative (without jQuery):

You can attach this process to an input event such as onkeyup or onfocusout:

function update() {

  amount = document.getElementById("amount");

  amount.value = parseInt(amount.value) - 5;

}

<input type="text" id="amount" onfocusout="update()">

edited Nov 20 at 18:53

answered Nov 20 at 18:44

João Eduardo

11517

The OP is actually asking for jQuery solution if I am not missing something.
– Vitaliy Terziev
Nov 20 at 18:46

Ops, my mistake!! Well, as someone already posted a corrected answer using jQuery I will edit the answer as a pure JavaScript alternative. Thanks for pointing out!!
– João Eduardo
Nov 20 at 18:50

add a comment |

EDIT: In case you are looking for a pure JavaScript alternative (without jQuery):

You can attach this process to an input event such as onkeyup or onfocusout:

function update() {

  amount = document.getElementById("amount");

  amount.value = parseInt(amount.value) - 5;

}

<input type="text" id="amount" onfocusout="update()">

edited Nov 20 at 18:53

answered Nov 20 at 18:44

João Eduardo

11517

EDIT: In case you are looking for a pure JavaScript alternative (without jQuery):

You can attach this process to an input event such as onkeyup or onfocusout:

function update() {

  amount = document.getElementById("amount");

  amount.value = parseInt(amount.value) - 5;

}

<input type="text" id="amount" onfocusout="update()">

function update() {

  amount = document.getElementById("amount");

  amount.value = parseInt(amount.value) - 5;

}

<input type="text" id="amount" onfocusout="update()">

function update() {

  amount = document.getElementById("amount");

  amount.value = parseInt(amount.value) - 5;

}

<input type="text" id="amount" onfocusout="update()">

edited Nov 20 at 18:53

answered Nov 20 at 18:44

João Eduardo

11517

edited Nov 20 at 18:53

answered Nov 20 at 18:44

João Eduardo

11517

answered Nov 20 at 18:44

João Eduardo

11517

answered Nov 20 at 18:44

João Eduardo

11517

The OP is actually asking for jQuery solution if I am not missing something.
– Vitaliy Terziev
Nov 20 at 18:46

Ops, my mistake!! Well, as someone already posted a corrected answer using jQuery I will edit the answer as a pure JavaScript alternative. Thanks for pointing out!!
– João Eduardo
Nov 20 at 18:50

add a comment |

The OP is actually asking for jQuery solution if I am not missing something.
– Vitaliy Terziev
Nov 20 at 18:46

Ops, my mistake!! Well, as someone already posted a corrected answer using jQuery I will edit the answer as a pure JavaScript alternative. Thanks for pointing out!!
– João Eduardo
Nov 20 at 18:50

The OP is actually asking for jQuery solution if I am not missing something.
– Vitaliy Terziev
Nov 20 at 18:46

Ops, my mistake!! Well, as someone already posted a corrected answer using jQuery I will edit the answer as a pure JavaScript alternative. Thanks for pointing out!!
– João Eduardo
Nov 20 at 18:50

add a comment |

JavaSript solution.
This will work for you.

document.getElementById("input").onblur = substract;



function substract() {

  let firstValue = event.currentTarget.value;

  let finalValue = Number(firstValue) - 5;

  document.getElementById("input").value = finalValue;

}

answered Nov 20 at 18:50

user18984

375

add a comment |

JavaSript solution.
This will work for you.

document.getElementById("input").onblur = substract;



function substract() {

  let firstValue = event.currentTarget.value;

  let finalValue = Number(firstValue) - 5;

  document.getElementById("input").value = finalValue;

}

answered Nov 20 at 18:50

user18984

375

add a comment |

JavaSript solution.
This will work for you.

document.getElementById("input").onblur = substract;



function substract() {

  let firstValue = event.currentTarget.value;

  let finalValue = Number(firstValue) - 5;

  document.getElementById("input").value = finalValue;

}

answered Nov 20 at 18:50

user18984

375

JavaSript solution.
This will work for you.

document.getElementById("input").onblur = substract;



function substract() {

  let firstValue = event.currentTarget.value;

  let finalValue = Number(firstValue) - 5;

  document.getElementById("input").value = finalValue;

}

answered Nov 20 at 18:50

user18984

375

answered Nov 20 at 18:50

user18984

375

answered Nov 20 at 18:50

user18984

375

answered Nov 20 at 18:50

user18984

375

add a comment |

To do this you need need to create a function and attach the input Element to the function.

Creating a function to reduce input element on change by 5.

var myfunction = function(){

      var value = parseInt(this.value);

     //check if input is of type int and less than five to avoid negative numbers.

     if( !value || value < 5 ){

          return false;

      }

     this.value = value - 5;

 };



 //ataching function to the element

var element = document.getElementById('my_input');

element.addEventListener( 'change', myfunction, false );

answered Nov 20 at 18:52

Edwin Dijas Chiwona

34118

add a comment |

To do this you need need to create a function and attach the input Element to the function.

Creating a function to reduce input element on change by 5.

var myfunction = function(){

      var value = parseInt(this.value);

     //check if input is of type int and less than five to avoid negative numbers.

     if( !value || value < 5 ){

          return false;

      }

     this.value = value - 5;

 };



 //ataching function to the element

var element = document.getElementById('my_input');

element.addEventListener( 'change', myfunction, false );

answered Nov 20 at 18:52

Edwin Dijas Chiwona

34118

add a comment |

To do this you need need to create a function and attach the input Element to the function.

Creating a function to reduce input element on change by 5.

var myfunction = function(){

      var value = parseInt(this.value);

     //check if input is of type int and less than five to avoid negative numbers.

     if( !value || value < 5 ){

          return false;

      }

     this.value = value - 5;

 };



 //ataching function to the element

var element = document.getElementById('my_input');

element.addEventListener( 'change', myfunction, false );

answered Nov 20 at 18:52

Edwin Dijas Chiwona

34118

To do this you need need to create a function and attach the input Element to the function.

Creating a function to reduce input element on change by 5.

var myfunction = function(){

      var value = parseInt(this.value);

     //check if input is of type int and less than five to avoid negative numbers.

     if( !value || value < 5 ){

          return false;

      }

     this.value = value - 5;

 };



 //ataching function to the element

var element = document.getElementById('my_input');

element.addEventListener( 'change', myfunction, false );

answered Nov 20 at 18:52

Edwin Dijas Chiwona

34118

answered Nov 20 at 18:52

Edwin Dijas Chiwona

34118

answered Nov 20 at 18:52

Edwin Dijas Chiwona

34118

answered Nov 20 at 18:52

Edwin Dijas Chiwona

34118

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

Some of your past answers have not been well-received, and you're in danger of being blocked from answering.

Please pay close attention to the following guidance:

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Ytukyg