2017-06-26 1 views
2

私は解決策を見つけることなく何日間もこの問題を解決しようとしています。私はdbから情報を取得することを目的としたWebアプリケーションを開発中です。私は流星と炎を使用しています。 実際には、私はテンプレートイベントのCSSプロパティを変更したいと考えています。これは、クリック対象の要素のCSSの比率を扱うか、any DOM要素を同じテンプレートに置き換えます。メテオテンプレートのCSSプロパティを変更するには?

Template.devicesConfiguration.events({ 

    'click .buttonsValue':function(e, template){ 

//works well on the parent of the target of the click event : 

    $(e.target.parentElement).css('background-color', 'chartreuse'); 

//works well on the target of the click event : 

    e.target.style.backgroundColor="#ffcccc"; 

//does the same thing but with a different syntax : 

    $(e.currentTarget).css('background-color', '#ffcccc'); 

// Does not work ... 

    var CheckButtonsLed = template.find('.CheckButtonsLed'); 
    CheckButtonsLed.style.marginLeft = '2 em'; 
    } 
}); 

それはbackgroundプロパティのために働く一方で、それはマージンproportiesを好きではないようだ:

<button type="button" class="buttonsValue" value="{{value}}"> 
     <div class="CheckButtonsLed"></div> 
</button> 

はここに私のテンプレートのイベントコードです:

は、ここに私のテンプレートコードタグです。私のクラス要素は私のテンプレートdevicesConfigurationです。

私はmarginプロパティのターゲットは私のクリックイベントの対象ではありませんので、それがあったが、私は結果なしでイベント(.buttonsvalue)のターゲットのマージンを変更しようとしました...

最初に考えました誰かがアイデアを持っていますか?どうもありがとう ! :)

+0

https://stackoverflow.com/q/12982269/2298362これをチェック! –

+0

ありがとう!確かに。私は、このボタンで、今のCSSプロパティを変更することができるかどうかを確認するつもりです: <ラベルクラス=「buttonsValue」> \tの \t

+0

は、まあ、私はエラーを持っていませんが、 cssプロパティは変更されません:Template.devicesConfiguration.events({ 'click .buttonsValue':function(e、template){ var simpleInput = template.find( '#simpleInput'); simpleInput.style.padding = ' 2 em '; –

答えて

2

それは今動作します。それは、構文の問題を扱う:

私はあるDOM要素のCSSプロパティを(変更するには、一言で言えば入れて

simpleInput.style.padding = '2 em'; 

代わりに...

simpleInput.style.padding = '2em'; 

を書きましたイベントのターゲットではありません):

Template.devicesConfiguration.events({ 

    'click .buttonsValue':function(e, template){ 

     var simpleInput = template.find('#simpleInput'); 

     simpleInput.style.padding = '2em'; 

    } 

}); 

ボタンタグにdiv要素を入れないでください。 ..

Bye!

+0

あなたはそれを作ったよ! –

関連する問題