1

JavaScript を使用して、td をクリックして css (id) を読み込もうとしています。

onclick イベント

上の図では、ある td でメイン アカウント ホルダーを作成し、別の td で承認されたレポーターを作成しました。オンロード中にメイン アカウント ホルダー タブをロードする必要があります。つまり、主な口座保有者のバックグラウンドは、許可されたレポーターの場所に適用する必要があり、その逆も同様です。

.css ID は、

#account_holder{
         background: url('{{ STATIC_URL }}images/main-account-holder.png')no-repeat;
         background-size:100%;-moz-background-size: cover;
         background-size: cover;-o-background-size: cover;
         -webkit-background-size: cover;
    }
    #authorised_reportericon{
         background: url('{{ STATIC_URL }}images/authorised_reporter-icon.png')no-repeat;
         background-size:100%;
         -moz-background-size: cover;
         background-size: cover;-webkit-background-size: cover;-o-background-size: cover;
         background-color:#F0F0F0;
         border-top-right-radius: 10px;
         border-bottom-right-radius: 10px;
    }
    #account_holdericon{
         background: url('{{ STATIC_URL }}images/main-account-holder-icon.png')no-repeat;
         background-size:100%;
         -moz-background-size: cover;
         background-size: cover;
    } 
    #authorised_reporter{
         background: url('{{ STATIC_URL }}images/authorised_reporter.png')no-repeat;background-size:100%;
         -moz-background-size: cover;
         background-size: cover;
         background-color:#F0F0F0;
         border-top-right-radius: 10px;
         border-bottom-right-radius: 10px;   
    }

javascript を使用して、onclick の実行中に css ID を変更したいのですが、javascript でコーディングする方法がわかりません。

4

2 に答える 2

2

ID は一意である必要があります。それらを変更しないでください。代わりにクラスを使用する

Css の # を に置き換えます。次のように:

.account_holder{
         background: url('{{ STATIC_URL }}images/main-account-holder.png')no-repeat;
         background-size:100%;-moz-background-size: cover;
         background-size: cover;-o-background-size: cover;
         -webkit-background-size: cover;
    }

JavaScript を使用して要素のクラス名を変更する方法は次のとおりです。

編集：

 var your_element = document.getElementById('your_element_id');

   your_element.onclick = function(){
       this.className = 'account_holder';
   };
于 2013-04-25T18:20:39.073 に答える
0

jqueryを使用する場合、またはホバーを使用する場合は、mouseenterとmouseoutの両方のイベント状態を使用する必要があります

于 2013-04-25T18:19:53.563 に答える