Wie hat ein Link-Tag auf Mobilgeräten anders reagiert?

Question

Ich habe eine, die beim Klicken öffnet ein PDF in einem iframe auf der aktuellen Seite. Ich habe mich gefragt, ob es einen Weg gibt, wo man, wenn man auf einem Handy/Tablet ist, den Link entweder in einem anderen Tab öffnet, um das Lesen zu erleichtern, anstatt im iFrame wie auf dem Desktop.

Answer 1

Erwägen Sie diese if-Anweisung in Ihr Button-Klick-Methode:

if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { 
// Do mobile browser commands 
    }else{ 
     //Do desktop browser commands 
    } 

oder ein Verfahren für die zukünftige Verwendung erstellen:

var isMobile = { 
    any: function() { 
     return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows()); 
    } 
}; 

Dieses Verfahren würde wie folgt verwendet werden:

if(isMobile.any()) { 
    // Do mobile specific stuff here 
} 

Answer 2

Sie können zwei verschiedene Links für Mobilgerät und PC haben, verschiedene Aktionen zuweisen und die entsprechenden Links anzeigen lassen und andere ausblenden.

Sehen Sie folgendes Beispiel:

$('#pc').click(function(){ 
 
\t \t alert('action for pc'); 
 
\t }); 
 

 
\t $('#mobile').click(function(){ 
 
\t \t alert('action for Mobile'); 
 
\t });

@media screen and (min-width: 0px) and (max-width: 720px) { 
 
    #pc { display: none; } 
 
} 
 
@media screen and (min-width: 720px) and (max-width: 4000px) { 
 
    #mobile { display: none; } 
 
} 
 

 
#mobile{ 
 
    cursor:pointer; 
 
    } 
 

 
#pc{ 
 
    cursor:pointer; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="pc"> 
 
\t <a>Link For PC</a> 
 
</div> 
 

 
<div id="mobile"> 
 
\t <a>Link For Mobile</a> 
 
</div>