使用单选按钮更改文本框的背景颜色 [英] Changing The background color for a textbox using radiobutton

问题描述

Hai Friend's，


我的项目有一个小问题...
在我的Web表单中，我在单选按钮旁边有5个单选按钮，我有5个文本框，当我单击特定的单选按钮时，我想突出显示文本框的背景颜色

Hai Friend''s,


I have a small problem with my project ...
In my web form i have 5 radio buttons beside radio buttons i have 5 text boxes and i want to highlight the text box background color when i click on the particular radio button

推荐答案

将此样式标签放置在头部

place this style tag in head part

<style type="text/css">
      
        .mystyle
        {
            color: Blue;
            background-color: Red;
            border: 2px solid #DCDCDC;
        }
        .nocolor
        {
            background-color: White;
        }
    </style>

将此脚本放在头部

place this script in head part

<script type="text/javascript">
       var previousbox = 'TextBox1';
       function changecolor(rid) {

           document.getElementById(rid).className = "mystyle";
           document.getElementById(previousbox).className = "nocolor";
           previousbox = rid;
       }
   </script>

您的设计代码应该是这样的

and your design code should like this

<table width="50%">
                    <tr>
                        <td>
                            <input type="radio" id="Radio1" onclick="changecolor('TextBox1')" name="a" /><asp:TextBox

                                ID="TextBox1" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="radio" id="Radio2" onclick="changecolor('TextBox2')" name="a" /><asp:TextBox

                                ID="TextBox2" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="radio" id="Radio3" onclick="changecolor('TextBox3')" name="a" /><asp:TextBox

                                ID="TextBox3" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="radio" id="Radio4" onclick="changecolor('TextBox4')" name="a" /><asp:TextBox

                                ID="TextBox4" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="radio" id="Radio5" onclick="changecolor('TextBox5')" name="a" /><asp:TextBox

                                ID="TextBox5" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                </table>

亲爱的朋友，
这是成功的答案........

设计页面
===========

Dear Friends,
This is Successful answer ..........

Design Page
===========

<asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="True"

            onselectedindexchanged="RadioButtonList1_SelectedIndexChanged">
            <asp:ListItem Value="Red">Red
            <asp:ListItem Value="green">Green

        <asp:TextBox ID="TextBox1" runat="server">

背后的代码
===========
只需也包括此名称空间......

Code behind
============
Just Include this Name space also.........

using System.Drawing;

protected void RadioButtonList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        if (RadioButtonList1.SelectedValue == "Red")
        {
            TextBox1.BackColor = Color.Red;
        }
        else
        {
            TextBox1.BackColor = Color.Green;
        }
    }

试试这个可爱的答案.........这是对您的帮助.

Try this Cute answer.........which is helpfil to u.

试试这个

Hi,

try this

<asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="True"

            onselectedindexchanged="RadioButtonList1_SelectedIndexChanged">
            <asp:ListItem Value="Red">Red</asp:ListItem>
            <asp:ListItem Value="green">Green</asp:ListItem>
        </asp:RadioButtonList>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

背后的代码

Code Behind

protected void RadioButtonList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        if (RadioButtonList1.SelectedValue == "Red")
        {
            TextBox1.BackColor = Color.Red;
        }
        else
        {
            TextBox1.BackColor = Color.Green;
        }
    }

祝你好运

Best Luck

这篇关于使用单选按钮更改文本框的背景颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！