Analyse häufiger Probleme in jquery mobile development_jquery

In diesem Artikel werden häufige Probleme bei der mobilen JQuery-Entwicklung anhand von Beispielen analysiert. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

jquery mobile ist sehr leistungsfähig. Sie müssen keine Methoden in das Programm schreiben, um zu bestimmen, um welche Art von Mobiltelefon es sich handelt. Sie können js verwenden, um Kompatibilität mit verschiedenen Smartphones zu erreichen. Das liegt auch an seinen leistungsstarken Funktionen. Das jQuery-Mobile-Plug-in verfügt über mehr als 200 K und das Min. über 140 K.

1. jquery mobile führt Seitenanfragen über Ajax durch. Wie jeder weiß, leert Ajax keine neuen Seiten. Mit anderen Worten: Änderungen in der Adressleiste sind keine echten Updates. Es liegt ein Problem vor. JS wird nur ausgeführt und funktioniert, wenn die Seite aktualisiert wird. Wenn Sie jedoch auf den Sprung auf der Seite klicken, funktioniert er nicht zurück.

Fehlercode:

<script type="text/javascript">
$(function(){
  $('#search01').bind("click",function(){
    $('.searchPanel').show();
  });
});
</script>

Korrekter Code:

<script type="text/javascript">
$(function(){
  $('#search01').live("click",function(){ //jquery 1.7系列
    $('.searchPanel').show();
  });
});
</script>

Wenn es sich um eine JQuery 1.9-Serie handelt

<script type="text/javascript">
$(document).on('click', '#search01', function () { //jquery 1.9系列
  $('.searchPanel').show();
});
</script>

2. Alle Seiten befinden sich auf einer Seite. Achten Sie zu diesem Zeitpunkt darauf, nicht dieselbe ID zu verwenden, da sonst nur die erste gelesen wird. Wenn eine Seite mehrere Seiten enthält, treten viele Probleme auf. Beispielsweise ist die Berechnung des Abstands vom Etikett zum oberen Rand des Fensters ungenau.

Falsche Schreibweise:

$('html,body').animate({
   scrollTop: $('.content').offset().top
}, 100);

Das Problem beim Schreiben auf diese Weise besteht darin, dass möglicherweise viele Seiten vor der aktuellen Seite stehen, sodass der oberste Wert falsch ist. Wenn Sie die Seite aktualisieren, ist der Wert korrekt

Richtiges Schreiben:

$('html,body').animate({
   scrollTop: $('.ui-page-active .content').offset().top
}, 100);

.ui-page-active gibt die aktuell aktive Seite an, sodass die berechnete Höhe korrekt ist.

3. Das Zuweisen von PHP-Variablen zu JS-Variablen funktioniert manchmal, manchmal nicht.

Code kopieren Der Code lautet wie folgt:

color = '
Die Ursache dieses Problems wurde nicht gefunden. Es kann jedoch auf andere Weise gelöst werden.

<input type="hidden" id='color' value='<&#63;php echo $color;&#63;>'>
<script type="text/javascript">
  color = $('.ui-page-active #color').val();
</script>

Ich hoffe, dass dieser Artikel allen in der jQuery-Programmierung hilfreich sein wird.

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn