運用しているECサイトに実装したいのですが、
indexOf にて文字列を判別し、HTMLの表示・非表示を切り替えたいと思っています。
該当のソースコード
【HTML】
<span class="login-tag">_MEMBER_</span> <ul> <li class="login"><a href="###">ログイン</a></li> <li class="member"><a href="###">マイページ</a></li> </ul>
MEMBER 部分は別のJSにより(.innerHTML)
非会員であれば「0」、会員であれば「1」に変換されます。
【JS】
$(function() { $('.login-tag').each(function() { var logintag = $(this); if (logintag.text().indexOf('1') >= 0) { logintag.next('ul').children('.login').hide(); logintag.next('ul').children('.member').show(); } else { logintag.next('ul').children('.login').show(); logintag.next('ul').children('.member').hide(); } }); });
別JSにより変換される文字列を利用して、
非会員 ⇒ .login を表示
会員 ⇒ .member を表示
といった形で切替を行いたいです。
発生している問題
別JSにより変換される前の文字列「MEMBER」での判定になってしまっているためだと思うのですが
正しく表示が切り替わりません。
(常に .login の方だけが表示される状態)
補足情報
別JSは私が管理できないサーバー上にあるファイルのため、編集が出来ません。
(会員ランク、保有ポイント数などをサイト上に表示させるためにECサイト側が用意しているJSでして、
読み込ませること自体はマニュアルにも記載のあるものなので問題はありません)
やりたいこと
置換される前の「MEMBER」ではなく .innerHTML により変換された後の文字列で判別したいのですが、
難しいでしょうか。
JS初心者のため、解決策があればぜひお伺いしたいです。
よろしくお願いいたします。