三个文本框,任意两个文本框输入数字后,剩下的文本框得到最后的值;如100数值,第一个文本框输入20,第二个输入10,那个的个得到值是70,只要输入了两个文本框的值,第三个文本框的值就自动显示,注意,三个文本框输入的值是没有按顺序的,三个文本框只要随便两个文本框输入值就会得自动显示第三个文本框的值

解决方案 »

  1.   

    自动显示不难,autopostback就行。
    不按顺序也不难,多加几个条件判断就行了(任意两个文本框不为空)。
    当然了,效果更好点的话也可以使用ajax。
      

  2.   

    function add()
    {
    var m="";
    var n="";
    var txt;
    for(i=0;i<3;i++)
    {
       var obj=document.getElementsByTagName("input")[i];
       if(obj.value!="")
       {
           if(m!="")
           {
              m=obj.value;
           }
           else
           {
              n=obj.value;
           }
       }
       else
       {
           txt=obj;
       }
    }
    if(m!=""&&n!="")
    {
       txt.value=m+n;
    }
      setTimeout(add,10);
    }
      

  3.   

    用ajax做的实例,只要输入两个文本框的值,第三个是自动显示出来的,不用计算了
      

  4.   

    TextBox1.Attributes.Add("onblur", "调用js方法");
    TextBox2.Attributes.Add("onblur", "调用js方法");
      

  5.   

                $("#TextBox2").blur(function () {
                    var text1 = $("#TextBox1").val();
                    var text2 = $("#TextBox2").val();
                    var text3 = $("#TextBox3").val();
                    if (text1 != "" && text2 != "") {
                        $("#TextBox3").val(Number(100 - text1 - text2));
                    }
                });
     以此类推
      

  6.   

    后台  protected void TextBox1_TextChanged(object sender, EventArgs e)
            {
                if (!string.IsNullOrEmpty(this.TextBox1.Text.Trim()) && !string.IsNullOrEmpty(this.TextBox2.Text.Trim()))
                {
                   this.TextBox3.Text= (Convert.ToInt32(this.TextBox1.Text) + Convert.ToInt32(this.TextBox2.Text)).ToString();
                }
            }        protected void TextBox2_TextChanged(object sender, EventArgs e)
            {
                if (!string.IsNullOrEmpty(this.TextBox1.Text.Trim()) && !string.IsNullOrEmpty(this.TextBox2.Text.Trim()))
                {
                    this.TextBox3.Text = (Convert.ToInt32(this.TextBox1.Text) + Convert.ToInt32(this.TextBox2.Text)).ToString();
                }
            }
    前台<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True" 
                ontextchanged="TextBox1_TextChanged"></asp:TextBox>
            <asp:TextBox ID="TextBox2" runat="server" AutoPostBack="True" 
                ontextchanged="TextBox2_TextChanged"></asp:TextBox>
            <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
        </div>
        </form>
    </body>
    </html>代码不是很规范,自己改一下吧
      

  7.   

    在每个textbox的onblur事件的时候调用函数进行判断
      

  8.   

    每个文本框输入时都对另外2个文本框进行判断,如果其中一个有值,那么就在另外一个文本框里写入结果,
    举个例子:三个文本框txt1,txt2,txt3
    <input type="text" id="txt1" name="txt1" onchange="fun1()" />
    <input type="text" id="txt2" name="txt2" onchange="fun2()" />
    <input type="text" id="txt3" name="txt3" onchange="fun3()" /><script type="text/javascript">
    function fun1()
    {
    if(document.getElementById("txt2").value != "")
    {
    document.getElementById("txt3").value = 100 - document.getElementById("txt2").value - document.getElementById("txt1".value)
    }
    else if(document.getElementById("txt3").value != "")
    {
    document.getElementById("txt2").value = 100 - document.getElementById("txt3").value - document.getElementById("txt1".value)
    }
    }

    function fun2()
    {
    if(document.getElementById("txt1").value != "")
    {
    document.getElementById("txt3").value = 100 - document.getElementById("txt2").value - document.getElementById("txt1").value
    }
    else if(document.getElementById("txt3").value != "")
    {
    document.getElementById("txt1").value = 100 - document.getElementById("txt3").value - document.getElementById("txt2").value
    }
    }

    function fun3()
    {
    if(document.getElementById("txt1").value != "")
    {
    document.getElementById("txt2").value = 100 - document.getElementById("txt1").value - document.getElementById("txt3").value
    }
    else if(document.getElementById("txt2").value != "")
    {
    document.getElementById("txt1").value = 100 - document.getElementById("txt3").value - document.getElementById("txt2").value
    }
    }
    </script>
      

  9.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>计算24点</title>    <script src="lib/jquery-1.4.2.js" type="text/javascript"></script>    <script type="text/javascript">
            $(document).ready(function() {
                $("input").each(function(key, value) {
                    $(value).blur(function() {
                        var i = 0;
                        var total = 0;
                        var obj;
                        $(this).parent().find("input").each(function(key, value) {
                            if ($(value).val() != "") {
                                i = i + 1;
                                total = total + parseInt($(value).val());
                            }
                            else {
                                obj = $(value);
                            }
                        });
                        if (i == 2) {
                            $(obj).val(24 - total);
                            $("input").attr("disabled", "disabled");
                        }
                    });
                });            $("a").click(function() {
                    $("input").removeAttr("disabled").val("");
                    return false;
                });
            });
        </script></head>
    <body>
        <p>
            计算24点
        </p>
        <input type="text" />
        <input type="text" />
        <input type="text" />
        <br />
        <br />
        <br />
        <a href="">Reset</a>
    </body>
    </html>