Изображение на весь экран на ощупь и нажмите

Question

Я могу заставить это работать одним нажатием на P C, но не касанием на мобильном устройстве.

$('.img-responsive').on('click', function(){
    var src = $(this).attr('src');
    $('<div>').css({
        background: 'RGBA(0,0,0,.5) url('+src+') no-repeat center',
        backgroundSize: 'contain',
        width:'100%', height:'100%',
        position:'fixed',
        zIndex:'10000',
        top:'0', left:'0',
        cursor: 'zoom-out'
    }).on('click', function(){
        $(this).remove();
    }).appendTo('body');
});

У кого-нибудь есть какие-нибудь советы?

спасибо!

Answer 1

попробуйте делегировать событие click от родителя кнопки или родителя родителя

$("body").delegate(".img-responsive", "click", function(){
//your action code
});

надеюсь, что это сработает!, И эта ссылка также может помочь вам https://www.codewall.co.uk/jquery-on-click-function-not-working-after-appending-html/

Answer 2

Используйте объект HTMLEvents с document.createEvent() для имитации щелчка по ссылке.

    var link = document.getElementById( 'link_to_click' ),
    event = document.createEvent( 'HTMLEvents' );

    event.initEvent( 'click', true, true );
    link.dispatchEvent( event );