weixin_42502209
2012-11-07 09:43
浏览 1.6k

javascript 一个文本框的值如何根据另一个文本框的值改变而改变

javascript 一个文本框的值如何根据另一个文本框的值改变而改变,
比如: 文本框1 输入的为 12345 ,文本框2原本的值为"789",然后再把文本框1 的值12345 给加上去,文本框2的值为78912345,当文本框1的值12345 删除后,文本框2 的值应该显示为 789 ,我要实现这个效果,不知道我描述清楚了没。。

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

8条回答 默认 最新

  • zhuzhenlong 2012-11-16 10:59
    已采纳



    <br> window.onload=function(){</p> <pre><code> if(document.getElementById(&quot;2&quot;).value != &#39;undefined&#39;){ document.getElementById(&quot;3&quot;).value = document.getElementById(&quot;2&quot;).value; } } function changeValue(){ var a = document.getElementById(&quot;1&quot;); var b = document.getElementById(&quot;3&quot;); var c = document.getElementById(&quot;2&quot;); c.value = b.value+a.value; } function updateValue(){ if(document.getElementById(&quot;2&quot;).value != &#39;undefined&#39;){ document.getElementById(&quot;3&quot;).value = document.getElementById(&quot;2&quot;).value; } } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;input type=&quot;hidden&quot; id=&quot;3&quot; value=&quot;&quot; /&gt; 1:&lt;input type=&quot;text&quot; id=&quot;1&quot; name =&quot;1&quot; onchange=&quot;changeValue();&quot; value=&quot;&quot; /&gt;&lt;br/&gt; 2:&lt;input type=&quot;text&quot; id=&quot;2&quot; name=&quot;2&quot; onchange=&quot;updateValue();&quot; value=&quot;789&quot; /&gt; &lt;/body&gt; </code></pre> <p></html></p>
    已采纳该答案
    打赏 评论
  • pangxin001 2012-11-07 10:48


    var input1pre; $(function(){ $('#input1').change(function(){ var val1 = $(this).val(); var val2 = $('#input2').val(); if(typeof input1pre != 'undefined') { val2 = val2.substring(0, val2.lastIndexOf(input1pre)); } input1pre = val1; $('#input2').val(val2 + val1); }); });
    1 打赏 评论
  • iteye_5246 2012-11-07 09:48

    监听文本框的 change事件咋第二个change事件中,获取第二个文本框的值,赋值给第一个文本框。

    打赏 评论
  • witcheryne 2012-11-07 15:06

    效果看这里:
    http://jsfiddle.net/26RGG/7/

    代码:
    html:
    [code="html"]


    [/code]

    javascript:
    [code="javascript"]
    $(document).ready(function() {
    $('#ipt-edit').keydown(function(e) {
    var key = e.keyCode;

        // 过滤非数字键
        // 8 是 backspace
        if( (key < 48 || key > 57) && key != 8) {
            // is not a number or backspace key
            return false;
        }
    
        // 处理backspace
        if(key == 8) {
            var origin = $('#ipt-target').val();
            var end = origin.slice(0, origin.length - 1);
    
            $('#ipt-target').val(end);
            return true;
        }
    
        // 处理按下的数字
        var targetVal = $('#ipt-target').val();
        var result = [targetVal, key - 48].join('');
    
        $('#ipt-target').val(result);
    });
    

    });​
    [/code]

    打赏 评论
  • witcheryne 2012-11-07 15:11

    之前的当#ipt-edit为空的时候, 再按backspace会有问题:
    新版本看这里:

    [url]http://jsfiddle.net/26RGG/7/[/url]

    [code="javascript"]
    $(document).ready(function() {
    $('#ipt-edit').keydown(function(e) {
    var key = e.keyCode;

        // 过滤非数字键
        // 8 是 backspace
        if( (key < 48 || key > 57) && key != 8) {
            // is not a number or backspace key
            return false;
        }
    
        // 处理backspace
        if(key == 8) {
            var origin = $('#ipt-target').val();
            var end = origin.slice(0, origin.length - 1);
    
            $('#ipt-target').val(end);
            return true;
        }
    
        // 处理按下的数字
        var targetVal = $('#ipt-target').val();
        var result = [targetVal, key - 48].join('');
    
        $('#ipt-target').val(result);
    });
    

    });​
    [/code]

    打赏 评论
  • pangxin001 2012-11-08 09:49

    [code="html"]

    <br> var input1pre; <br> function changeValue() {<br> var val1 = document.getElementById(&#39;input1&#39;).value;<br> var val2 = document.getElementById(&#39;input2&#39;).value;<br> if(typeof input1pre != &#39;undefined&#39;) {<br> val2 = val2.substring(0, val2.lastIndexOf(input1pre));<br> }<br> input1pre = val1;<br> document.getElementById(&#39;input2&#39;).value = val2 + val1;<br> }<br> [/code]

    打赏 评论
  • JavaNoob 2012-11-08 11:06

    Presuming:

    1, Text2 input is readonly.
    2, Not limitted inputing number only.

    Then you can see this: http://jsfiddle.net/YGG3X/4/

    打赏 评论
  • iteye_20269 2012-11-08 12:34

    :idea:

    打赏 评论

相关推荐 更多相似问题