suchen

Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Erläuterung der benutzerdefinierten tag_jquery von jQuery Mobile

Detaillierte Erläuterung der benutzerdefinierten tag_jquery von jQuery Mobile

WBOY
WBOYOriginal
2016-05-16 15:21:391067Durchsuche

In diesem Artikel werden benutzerdefinierte jQuery Mobile-Tags anhand von Beispielen erläutert und als Referenz für Sie bereitgestellt. Der spezifische Inhalt lautet wie folgt:
Bei der Planung von Produktinternationalisierungsanforderungen werden PC-Web, mobiles Web und verschiedene Apps einbezogen. Es wurden mehrere Versionen des mobilen Webs entwickelt, von denen keine ideal ist.
Da das mobile Web das jQuery Mobile-Framework nutzt, gab es eine Diskussion darüber, wo es sinnvoller wäre, die Sprache zu wechseln. Ich werde den Diskussionsprozess und die verschiedenen Pläne nicht erwähnen. Werfen wir zunächst einen Blick auf den endgültigen Effekt:

Fühlt es sich sehr erfahren an? Ich habe es am Anfang viele Male ausprobiert und schließlich eine Dropdown-Option angepasst. Der Code lautet wie folgt: 

<!DOCTYPE html> 
<html> 
<head> 
  <title>jQuery Mobile</title> 
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0"> 
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
  <meta http-equiv="Expires" content="0"> 
  <meta http-equiv="Pragma" content="no-cache"> 
  <meta http-equiv="Cache-control" content="no-cache, must-revalidate"> 
  <meta http-equiv="Cache" content="no-cache"> 
  <link rel="stylesheet" href="jQuery/jquery.mobile-1.4.4.min.css" type="text/css"> 
  <script type="text/javascript" src="jQuery/jquery-1.8.3.min.js"></script> 
  <script type="text/javascript" src="jQuery/jquery.mobile-1.4.4.min.js"></script> 
  <script type="text/javascript" src="jQuery/jquery.cookie.js"></script> 
  <script type="text/javascript" src="jQuery/jquery.i18n.properties-min-1.0.9.js"></script> 
  <style type="text/css"> 
    .comFooter{ 
      position: absolute; bottom: 0; left:0; height: 40px; width: 100%; 
    } 
  </style> 
</head> 
<body> 
  <div data-role="page" id="pageWel" data-title="脚本"> 
    <div data-role="header" data-theme="b"> 
      <a href="#" data-role="button" class="ui-btn-left" data-icon="check">测试</a> 
      <h1 class="title" data-i18n="global_title"> 
        脚本之家
      </h1> 
      <!-- 具体代码 --> 
      <a href="javascript:void(0);" data-role="none" aria-haspopup="true" class="ui-btn-right"> 
        <select class="hupu_i18n_select" data-icon="check" data-role="button" data-inline="false" data-native-menu="false"> 
          <option value="zh-CN">简体中文</option> 
          <option value="zh-TW">繁體中文</option> 
          <option value="en">English</option> 
          <option value="ja">日本語の</option> 
        </select> 
      </a> 
      </div> 
    <div role="main" class="ui-content"> 
      欢迎大家关注脚本之家 
    </div> 
    <div data-role="footer" data-theme="b" class="comFooter"> 
      <span style="height: 40px; line-height: 40px; text-align: center; display: block; font-size: 9px;">1213456</span> 
    </div> 
  </div> 
</body> 
</html>

Das Obige ist die relevante Einführung in die benutzerdefinierten Tags von jQuery Mobile. Ich hoffe, dass es für alle hilfreich ist, die benutzerdefinierten Tags von jQuery Mobile zu verstehen.

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
Vorheriger Artikel：Eine einfache Möglichkeit, Datumsgrößen in Javascript_Javascript-Kenntnissen zu vergleichenNächster Artikel：Eine einfache Möglichkeit, Datumsgrößen in Javascript_Javascript-Kenntnissen zu vergleichen

In Verbindung stehende Artikel

Mehr sehen