Как переключить элемент при нажатии на iFrame в div?

Я хотел бы переключить класс 'hide' на div 'эквалайзер' при нажатии кнопки воспроизведения аудиозаписи в моей теме tumblr. Мой HTML выглядит следующим образом:

<div class="musicplayer">
<div id="playbutton">
{block:AudioPlayer}
{AudioPlayer}{/block:AudioPlayer}</div>
<div class="equalizer hide">
</div>

Проблема в том, что tumblr импортирует соответствующий код для аудиоплеера, поэтому следующий скрипт не запускается:

$('.playbutton').click(function(){
     $(".equalizer").toggleClass("hide");
});

В исходном коде страницы HTML этого раздела выглядит следующим образом:

<div class="musicplayer">
<div id="playbutton">
<span id="audio_player_151764783410"><div class="audio_player"><iframe class="tumblr_audio_player tumblr_audio_player_151764783410" src="http://myspacethemeology.tumblr.com/post/151764783410/audio_player_iframe/myspacethemeology/tumblr_o6qkb21Z4L1utbsw6?audio_file=http%3A%2F%2Fk003.kiwi6.com%2Fhotlink%2Fdge2vl4ftj%2F04_Into_You.mp3&color=white&simple=1" frameborder="0" allowtransparency="true" scrolling="no" width="207" height="27"></iframe></div></span></div>
<div class="equalizer hide">
</div></div>

Аудиоплеер находится внутри iFrame, а класс iFrame отличается для каждого отдельного аудиозаписи. Есть ли какой-нибудь скрипт, который может вызвать событие при нажатии кнопки воспроизведения?


javascript iframe jquery tumblr
person RKC    schedule 09.03.2017    source источник
comment
Я ошибся в этом вопросе, но #playbutton тоже не работает. Спасибо хоть.   -  person RKC    schedule 10.03.2017
comment
Я только что был на вашем сайте и заметил, что класс на самом деле .play_button. Мне удалось получить к нему доступ через jquery, используя $ (. Play_button)   -  person Adam    schedule 10.03.2017
comment
@Adam Я пробовал это, и, кажется, ничего не происходит, когда я нажимаю кнопку воспроизведения.   -  person RKC    schedule 11.03.2017

Ответы (2)


arrow_upward
1
arrow_downward

Вы не можете обнаруживать события в iframe CROSS DOMAIN.

См. это ответ для справки.

person Adam    schedule 09.03.2017
comment
Спасибо, однако iframe по-прежнему находится в том же домене, что и страница, на которой запущен скрипт (оба находятся на myspacethemeology.tumblr.com < / а>). - person RKC; 10.03.2017

arrow_upward
0
arrow_downward

Вы не можете обнаружить событие для междоменных фреймов, как сказал @adam. Но с псевдоэлементом CSS все же можно проделать непростую вещь. Но это исправление отключит контроль над вашим iframe. т.е. вы не можете ничего щелкнуть в своем iframe.

.audio_player{
    position:relative;
}
.audio_player:after{
   content:'';
   position:absolute;
   top:0; left:0; right:0; bottom:0;
}

ваше событие щелчка теперь будет работать. Надеюсь это поможет.

person ajai Jothi    schedule 09.03.2017
comment
Спасибо за предложение, но поскольку iframe содержит кнопку воспроизведения для звука, в данном случае это бесполезно, поскольку iframe должен быть интерактивным. Я запомню его для использования в будущем! - person RKC; 10.03.2017