0

こんにちは、私はクラスを設定する PHP ループを実行しています。このループはアイテムのリストを作成し、それぞれにウィンドウを開く「共有」ボタンがあります (div 表示: なし) JavaScript がこの div を開きます。そしてそれは完璧に動作します..

私の問題は、この瞬間に<script>ループ内にコードを挿入したため、各アイテムに独自の<script></script>コードがあることです...

1 つだけ実行して、そのコードを php ループから取り出す方法はありますか?コードを改善できます。

  <script>
  $('a.sharebtnc').click(
            function(event) {
                event.stopPropagation();
                $('div.redescompartir').fadeToggle(300);

            }
        );
  </script>

ループでは、このような id をクラスに追加するだけです (id :32 )

  <script>
  $('a.sharebtnc32').click(
            function(event) {
                event.stopPropagation();
                $('div.redescompartir32').fadeToggle(300);

            }
        );
  </script>

ID番号に関係なく、このスクリプトをすべての要素で機能させるにはどうすればよいですか。わかりませんが、これが正しい方法であることはわかっています。

<a href="" > </a>HTML は非常にシンプルで、各アイテムで同じです...つまり、各アイテムには for要素を持つ独自の div があります

<a href="#" class="sharebtnc(id)"> 
<div class="redescompartir(id)">
<a href="" >Twitter </a>
<a href="" >Facebook </a>
<a href="" >Google </a>
<a href="" >Foursquare </a>
</div>
4

2 に答える 2

2

次のように入力要素に新しいクラスと属性を追加します

それ以外の

<a class="sharebtnc32" />

使用する

<a class="sharebtnc sharebtnc32" data-id="32"/>

それから

jQuery(function ($) {
    $('.sharebtnctl').click(function (event) {
        event.stopPropagation();
        $('.redesopenclose' + $(this).data('id')).fadeToggle(300);
    });
})
于 2013-09-28T00:05:14.883 に答える
1

私の好みの方法: PHP で 2 つの要素間のリンクを生成し、次に JS の小さなスニペットでどちらの要素がクリックされたかを取得します。

PHP: 

$num = 100;

for ($x = 0; $x < $numItems; $x++) {
    echo "
    <a href='#' class='sharebtn' target='$x'>Share</a>

    <div class='redescompartir' id='$x'>
    <a href=''>Twitter</a>
    <a href=''>Facebook</a>
    <a href=''>Google</a>
    <a href=''>Foursquare</a>
    </div>
    ";

}

HTML 出力:

<a href="#" class="sharebtn" target='32'>Share</a>

<div class="redescompartir" id='32'>
<a href="" >Twitter </a>
<a href="" >Facebook </a>
<a href="" >Google </a>
<a href="" >Foursquare </a>
</div>

JS:

$('a.sharebtn').on('click', function(e) {
    e.stopPropagation();
    var target = $(e.currentTarget).attr('target');
    $('#'+target).fadeToggle(300);
});

<script></script>このようにして、ユーザーのブラウザが感謝する単一のタグのみが必要になります。:)

于 2013-09-28T01:06:25.597 に答える