javascript onclick, объединяющий 2 события, не работает на ios (iPhone, iPad)

Question

Я объединяю 2 javascript-кода в onclick, чтобы сделать 2 вещи:
1. Остановить аудиоплеер
2. Загрузка и вставка видео с видео

Следующий код работаетво всех браузерах, кроме iOS (iPhone, iPad)

<a class="aboutclick" href="#" onclick="stop2();document.getElementById('frame').innerHTML='&lt;iframe src=&quot;paul-on-paul.html&quot; width=&quot;100%&quot; height=&quot;600&quot; scrolling=&quot;no&quot; frameborder=&quot;no&quot;&gt;&lt;/iframe&gt;'"><img src="assets/video-cold.jpg" alt="paul-gregory-video" width="161" height="81" border="0" /></a>

stop2() в начале кода onclick - это то, что отключает музыкальный проигрыватель.(это Flash аудио плеер, поэтому он не относится к iOS).Нажатие на изображение ничего не делает на iPad, iPhone с этим кодом присутствует.

Если я удаляю stop2(); из кода onclick, iframe загрузится на устройствах iOS.

Мне нужночтобы можно было использовать stop2() для уничтожения музыки, но мне также нужно, чтобы она работала на устройствах iOS.

Есть предложения?

Рабочий пример: http://www.fixxed.com/test/pg (нажмите на миниатюру видео в правом нижнем углу)

Answer 1

Сначала я бы предложил вам переместить весь ваш код onclick в функцию, а затем вызвать эту функцию по щелчку, например, так:

window.foo = function(e) {
    stop2();
    document.getElementById('frame').innerHTML='<iframe src="paul-on-paul.html" width="100%" height="600%" scrolling="no" frameborder="no"></iframe>'
}

...

<a class="aboutclick" href="#" onclick="foo">
  <img src="assets/video-cold.jpg" alt="paul-gregory-video" width="161" height="81" border="0" />
</a>

Это просто делает вещи намного приятнее для чтения и более удобными в обслуживании.Тогда я бы посоветовал вам использовать мобильные сенсорные события вместо событий кликов, в результате вы получите что-то вроде этого:

window.foo = function(e) {
    stop2();
}

window.bar = function(e) {
    document.getElementById('frame').innerHTML='<iframe src="paul-on-paul.html" width="100%" height="600%" scrolling="no" frameborder="no"></iframe>';
}

...

<a class="aboutclick" href="#" onclick="foo" ontouchstart='bar'>
  <img src="assets/video-cold.jpg" alt="paul-gregory-video" width="161" height="81" border="0" />
</a>

Answer 2

Кажется, что iOS задыхается от вашего stop2() вызова.Возможно, вы захотите попробовать определить, является ли браузер устройством iOS (один простой и не очень хороший способ сделать это со строкой user-agent) или (лучше) проверить, поддерживает ли браузер эту функцию, используя Modernizr .Затем, если вы обнаружите, что это браузер iOS, просто вернитесь с stop2().

Надеюсь, это поможет!