2017-10-09 7 views
0

私は自分のプロジェクトでセメントuiを使用しており、表示するツールチップの値を動的に生成したいと考えています。関数呼び出しでも計算できます。現在、私は公式ドキュメントからこれを持っている:セマンティックuiでツールチップ値を動的に生成

<div class="ui button" data-tooltip="Add users to your feed" data-position="top center"> 
    Top Center 
</div> 

私はすでにdynamic popup semantic uidynamic tooltip semantic uiなどの用語で検索しましたが、それは、関連する結果が得られませんでした。

以下は予想される機能です。

<div class="ui button" data-tooltip="callmyfunction()" data-position="top center"> 
    Top Center 
</div> 

答えて

0

要素にmouseoverイベントを割り当てる必要があります。これは、返信用

function callmyfunction(obj) { 
    var tt = obj.getAttribute('data-tooltip'); 
    obj.innerHTML = tt; 
} 
+0

thans(テストしていません)関数が表示される値を処理する必要機能

<div class="ui button" data-tooltip="" data-position="top center" onmouseover="callmyfunction(this)"> Top Center </div> 

を呼び出しますが、私はこのエラーはobj.getAttributeが関数ではありません取得します。私はvuejsを使用しているので、私はこのようなonmouseのホバーを追加しています(v-for = 't in th'のv-on:mouseover = "addextraInfotoHeader(this)" data-tooltip = ''、data-position = 'bottom center '){{t}} ' – anekix

+0

OK。ブラウザでdevツールバーを開きます(F12)。[Sources]タブをクリックします(名前はブラウザによって異なります)。関数を探します。ブレークポイントを設定します。ページをリフレッシュし、divの上にマウスを移動します。ブラウザはブレークポイントで停止します。 obj変数とその値を見てください。 – jeff

+0

これは(chromeで) 'scope'ヘッダの' local'ヘッダの下で行いました。これらの変数は 'obj'と' this'です。 'obj:Window'とその下の多くの属性 – anekix

関連する問題