admin管理员组

文章数量:1313180

The first keyup event will change the value of one input but on the change of one input gn() in not calling.

This is my code

function fn() {
  document.getElementById("one").value = "abc"
}

function gn() {
  document.getElementById("two").value = "def"
}
<input type="number" onkeyup="fn()">
<input type="number" id="one" onchange="gn()">
<input type="number" id="two">

The first keyup event will change the value of one input but on the change of one input gn() in not calling.

This is my code

function fn() {
  document.getElementById("one").value = "abc"
}

function gn() {
  document.getElementById("two").value = "def"
}
<input type="number" onkeyup="fn()">
<input type="number" id="one" onchange="gn()">
<input type="number" id="two">

  • javascript
  • jquery
  • html
Share Improve this question edited Jan 26, 2018 at 20:56 Daniel Beck 21.5k5 gold badges43 silver badges60 bronze badges asked Jan 25, 2018 at 21:16 26vivek26vivek 2111 gold badge4 silver badges10 bronze badges 3
  • Setting an element's value (eg element.value = 'something') does NOT trigger a change event. You can manually trigger the change event, or make sure to call any relevant functions after changing the value. – Sidney Commented Jan 25, 2018 at 21:24
  • generally onchange is fired onblur event.. so assigning value by code will not fire the event.. so it has to be invoked from code.. function fn(){ document.getElementById("one").value = "abc"; document.getElementById("one").onchange() } – Immanuel Commented Jan 25, 2018 at 21:25
  • Also, why are you trying to set numeric fields to string values? Did I miss a memo? – Snowmonkey Commented Jan 25, 2018 at 21:25
Add a ment  | 

2 Answers 2

Reset to default 3

The first assignment wasn't working because you were trying to set a "number" input to a non-numeric value.

The second assignment wasn't working because the onchange event isn't triggered when the value of a field is modified by script; you have to create and dispatch the event manually:

function fn() {
  // This will work because the #one input is now type="text"
  document.getElementById("one").value = "abc";

  // now create and dispatch a change event on the field you modified:
  var evt = new Event('change');
  document.getElementById("one").dispatchEvent(evt)
  // (Or, of course, just call gn() directly here.)
}

function gn() {
  document.getElementById("two").value = "def"
}
<input type="text" onkeyup="fn()">
<input type="text" id="one" onchange="gn()">
<input type="text" id="two">

You're trying to set the value of a number input to a string, and not even one that can be cast to a number.

Replace your functions with:

document.getElementById("one").value = "123";

or 

 document.getElementById("one").value = 123;

and that will work.

If you want the input to be set to abc, you should switch the input type from number to text

<input type="text" id="one" onchange="gn()">

EDIT I copied my proposed solution of changing inputs into text into an HTML file. Below is the entirety of that file:

  1 <html>
  2 
  3 <input type="text" onkeyup="fn()">                                                                                                                                                  
  4 <input type="text" id="one" onchange="gn()">
  5 <input type="text" id="two">
  6 
  7 <script>
  8     function fn(){ document.getElementById("one").value = "abc"}
  9     function gn(){ document.getElementById("two").value = "def"}
 10 </script>
 11 </html>

With this, a keyup event in the first box will change the 2nd input to abc. Changing the value (as in, entering in a value and clicking out of) the 2nd box will make the 3rd box have a value of def.

本文标签：

版权声明：本文标题：jquery - how to call javascript function when &lt;input&gt; value is already modify by another function? - Stack Overflo 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1741926484a2405319.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。