-3

動的に作成されたボタンの背景色を変更する際に問題があります。ページに動的に作成されたボタンがたくさんあります。最初のクリックでボタンを押して、2 回目のクリックで背景色を緑に変更したいのですが、この変更を行いたいです。 back.以下のコードで %2 ==0 で実行しようとしましたが、2回目のクリックが他のボタンにある可能性があることに気付きました.2回目のクリックでも緑色にしたい.私は毎回ループする必要があると思います2番目の質問は、最終的に緑色のボタンの値(テキスト値)だけをリストボックスに送信したいということです。以下は私のコードですが、成功しません。助けてください

<asp:ListBox ID="ListBox2" runat="server" Width="111px"></asp:ListBox>


        $(function () {
            var count = 0;
            $('input[type=button]').on('click', function (e) {
                e.preventDefault();
                count += 1;
                if (count % 2 === 0) {
                    $(this).css('background-color', '#6FA478');
                    var value = $(this).value;
                    $("[id$=ListBox2]").append($('<option/>').text(value).attr('value', value));
                }
                else {
                    $(this).css('background-color', '');
                }
            });
        });     
4

2 に答える 2

1

これを試してみてください。最初にクリックするとボタンが緑色になり、リストに保存されます。2回目にクリックすると、リストボックスから削除され、緑色の背景色も削除され、オンとオフモードで引き続き動作します。

$(function () {
    $('input[type=button]').on('click', function (e) {
        e.preventDefault();
        var toggle = $(this).data('toggle');
        var value = $(this).val();
        if(toggle && toggle == "1") {
            $(this).css('background-color', '');
            $('[id$=ListBox2] option[value="'+value+'"]').remove()
            $(this).data('toggle', '0');
        }else{
            $(this).css('background-color', '#6FA478');      
            $("[id$=ListBox2]").append('<option value="'+value+'">'+value+'</option>');
            $(this).data('toggle', '1');
        }
    });
});

または、.toggleも試してみてください

$(function () {
    $('input[type=button]').toggle(function (e) {
       e.preventDefault();
       var value = $(this).val();
       $(this).css('background-color', '#6FA478');      
       $("[id$=ListBox2]").append('<option value="'+value+'">'+value+'</option>');
    }, function(e){
       e.preventDefault();
       var value = $(this).val();
       $(this).css('background-color', '');
       $('[id$=ListBox2] option[value="'+value+'"]').remove()
   });
});
于 2012-11-01T12:50:50.257 に答える
0
$(':button').toggleClass(["red", "green"])

css ファイルで、赤と緑に値があることを確認します

于 2012-11-01T12:28:57.943 に答える