2013-09-28 3 views
0

Привет, я делаю цикл PHP, где я устанавливаю класс, этот цикл создает список элементов, и каждый из них будет иметь кнопку «share», которая откроет окно, (div дисплей: нет) Javascript не открыть этот DIV, и он отлично работает ..Приращение +1 класс в javascript

Моя проблема заключается в том, что в этот момент я вставил <script> код внутри цикла, так что каждый элемент имеет свой собственный <script></script> код ...

Есть ли способ сделать только один и вывести этот код из цикла php, поэтому я могу улучшить код.

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

      } 
     ); 
    </script> 

В Петле хорошо я просто добавить в класс идентификатор, как этот (ID: 32)

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

      } 
     ); 
    </script> 

Как я могу сделать этот скрипт работает для всех элементов независимо от идентификационного номера, я понятия не имею, но я знаю, что это правильный способ сделать это, правильно?

HTML, очень просто, его же для каждого элемента ... я имею в виду каждый элемент имеет свой собственный DIV с элементами для <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> 
+0

Как выглядит DOM? Является ли «input» дочерним, родительским или родственным «div»? Правильный способ сделать это - использовать «this» для обращения к элементу с щелчком, а затем перейти к цели, которую вы хотите переключить. – nrabinowitz

+0

div - это нормальный div, который будет вставлять мой код, но его нормальный div с четырьмя элементами href. –

ответ

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); 
    }); 
}) 
+0

Извините, возможно, я не сделал правильный вопрос, атрибут класса, сделанный в php-цикле, поэтому я получаю, например, 80 классов, с классом sharebtnid ... (пример sharebtn32 sharebtn33 и т. Д.). Мне нужен универсальный код для всех из них сохранить строки в javascript –

+1

@MonchoChavez все еще вы можете иметь несколько классов для элемента –

+0

i did not see the last part, будет acept в мин –

1

Мой предпочтительный метод: РНР для создания связи между этими двумя элементами, то небольшой фрагмент 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> тег, который broswers вашего пользователя будут вам благодарны за , :)

+0

Спасибо, я буду test У меня уже есть PHP, работающий нормально: D, я знаю, php моя проблема его с java спасибо, дайте мне попробовать –

+0

:(Черт, что им не хватает, http://jsfiddle.net/LSNXQ/1/ –

+0

Посмотрите, поможет ли это вам диагностировать проблема: http://jsfiddle.net/LSNXQ/3/ – Bavell

Смежные вопросы