0 
<asp:ListBox 
     ID="ddlPA" 
     ClientIDMode="Static" 
     runat="server" 
     AutoPostBack="true"
     SkinID="x" 
     CssClass="ListBoxCssClass" 
     SelectionMode="Multiple" 
     OnSelectedIndexChanged="ddlPA_SelectedIndexChanged">
</asp:ListBox>

asp:listbox でアイテムを選択すると、選択したアイテムの色が灰色に変わります。色を青に変更したいです。どうすれば同じことができますか？

4

2 に答える 2

1

最近これを検索しましたが、合理的な解決策が見つからなかったため、CSS のみで作成しました。ListBox から CheckBoxList に切り替えて、チェックボックスを非表示にしました。

この例では、単純にするために、すべての項目 (CSS のオプション) でチェックボックスを非表示にし、選択した項目 (CSS のラベル) の兄弟テキストのフォントの重みを 600 に設定しました。セレクターが正しく設定されています - 背景、疑似 :before 画像または境界線など。アイテムの前に何かを使用すると、スペースの問題が発生する可能性があることに注意してください。このオフセットを補うためにパディング/マージンを追加できます。これを行う方法はたくさんありますが、他のオプションを検討したくなるまでは、これで目的地にたどり着くことができます。

ASPX:

    <asp:CheckBoxList ID="chkList" CssClass="someclassname" runat="server" </asp:CheckBoxList>

CSS:

    .someclassname input {display: none;}

    .someclasssname input:checked + label {font-weight: 600;}

個人的には CSS の改行とインデントを好みますが、ここではなくても読みやすいです。

これは、他のチェックされていない項目の CSS セレクターです。

CSS:

    .someclass input:not(:checked) + label {font-weight: 400;}

繰り返しますが、チェックボックスを非表示にしてから、チェックボックスの右側のテキストをフォーマットしています。ここでのもう 1 つの優れた機能は、ユーザーがタッチ ベースの入力デバイスを使用して複数の項目を選択できるようになったことです。ctrl キーやスペース キーは必要ありません。

また、ListBox とは異なり、CheckBoxList ではユーザーの選択を 1 つに制限することはできません。この動作が必要な場合は、RadioButtonList に切り替えることができます。

于 2021-08-27T01:21:55.230 に答える
0

CssClass または BackColor プロパティを指定して、.aspx ページから背景色を設定できます。次のようになります。

<asp:ListBox CssClass="MyListBox" BackColor="#e0e0e0"></asp:ListBox>

選択したアイテムの設定は少しトリッキーです...これに直接属性があるとは思いません。次のように、javascript または jQuery で設定できます。

<script type="text/javascript">
  $(document).ready(function() {
    $('#MyListBox').click(function() {
        $("#MyListBox option:selected").css("background-color", "#e0e0e0");
    }); 
  });
</script>
于 2013-03-25T07:17:27.060 に答える