このページについて
このページでは、動的なリンク先を使った投稿の作り方について説明します。
※ 一例としてaタグのhrefで説明しておりますが、inputタグのtypeやvalue、divタグのonclickなどその他の編集にも有効な編集方法になります。
HTML を編集 機能を利用する際の注意点
UI エディターの HTML を編集 機能を利用する際、対象の要素内に、リンク (<a>
タグ) を含む場合、編集を開始した時点のリンク先 (href
属性) を、デザイン案の JavaScript コードに記録します。
対象サイトがそのリンク先を動的に変更している場合、
デザイン案描画時に、そのリンク先で上書きをしてしまう問題が発生します。
$("#registration").html("<p>今すぐ<a href=\"/regist?track_id=1234\">会員登録</a></p>")
仮に上記の様なコードで、対象サイトが track_id
パラメータの値を動的に生成している場合、1234
に固定されてしまいます。
編集する
この問題に対応するために、オリジナルのリンク先を参照する様に UI エディター左下にある、JavaScript
タブを開き、修正を行います。
$("#registration").html("<p>今すぐ<a href=\"" + $("#registration a").attr("href") + "\">会員登録</a></p>")
使用しているコード
$("対象のaタグ").attr("href");
このコードは aタグ の hrefに記述されている情報 を取得するものです。
()内に記述されている情報を変更すると、それに対応した情報が取得できます。
- .attr(“style”) –> 要素に設定されたstyle情報を取得できます
- .attr(“onclick”) –> 要素に設定されたonclick情報を取得できます。
0 コメント