有十个单选按钮和分别对应的十个文本框,当单击对应的按钮,弹出对应的文本框,还这个用jquery实现。

解决方案 »

  1.   

    最简单的方法就是每个给个ID
    然后写个
    $('#buttonid').click(弹出相应的文本框)
      

  2.   

    这种方法可以,但是10个我就写了10个
    $('#button1').click
    $('#button2').click
    $('#button2').click这个我怎么处理一下
      

  3.   


    <!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></title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"
    type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#btn1").click(function () {
                $("#txt1").css("display", "block");
                $("#txt2").css("display", "none");
                $("#txt3").css("display", "none");
                $("#txt4").css("display", "none");
                $("#txt5").css("display", "none");        });
            $("#btn2").click(function () {
                $("#txt1").css("display", "none");
                $("#txt2").css("display", "block");
                $("#txt3").css("display", "none");
                $("#txt4").css("display", "none");
                $("#txt5").css("display", "none");
            });
            $("#btn3").click(function () {
                $("#txt1").css("display", "none");
                $("#txt2").css("display", "none");
                $("#txt3").css("display", "block");
                $("#txt4").css("display", "none");
                $("#txt5").css("display", "none");
            });
            $("#btn4").click(function () {
                $("#txt1").css("display", "none");
                $("#txt2").css("display", "none");
                $("#txt3").css("display", "none");
                $("#txt4").css("display", "block");
                $("#txt5").css("display", "none");
            });
            $("#btn5").click(function () {
                $("#txt1").css("display", "none");
                $("#txt2").css("display", "none");
                $("#txt3").css("display", "none");
                $("#txt4").css("display", "none");
                $("#txt5").css("display", "block");
            });
        }); 
    </script>
    </head>
    <body>
    <input type="button" id="btn1" value="显示文本框1" />
    <input type="text" id="txt1" value="文本框1"  style=" display:none"/><input type="button" id="btn2" value="显示文本框2"/>
    <input type="text" id="txt2" value="文本框2" style=" display:none"/><input type="button" id="btn3" value="显示文本框3"/>
    <input type="text" id="txt3" value="文本框3" style=" display:none"/><input type="button" id="btn4" value="显示文本框4"/>
    <input type="text" id="txt4" value="文本框4" style=" display:none"/><input type="button" id="btn5" value="显示文本框5"/>
    <input type="text" id="txt5" value="文本框5" style=" display:none"/>
    </body>
    </html>是这样吗?有点复杂应该有更简单
      

  4.   

    建议,创建一个function函数传参数,参数是你要显示的文本框的id  将单击事件植入你要单击的button