0

嗨，我正在做一个 PHP 循环，我在其中设置了一个类，这个循环创建了一个项目列表，每个项目都有一个“共享”按钮，可以打开一个窗口，（div display:none）javascript 打开这个 div，它工作完美..

我的问题是，此时我已经<script>在循环中插入了代码，所以每个项目都有自己的<script></script>代码......

有没有办法只做一个并将该代码从 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 编号如何，如何使该脚本适用于所有元素，我不知道，但我知道这是正确的方法，对吧？

HTML 非常简单，每个项目都相同...我的意思是每个项目都有自己的 div 和 for<a href="" > </a>元素

<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 生成两个元素之间的链接，然后一小段 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 回答