1

jade & express で jquery mobile を使用しようとしています。私は翡翠に少し慣れていません。ここで何がうまくいかないのかを理解するのに役立ちます。私は、zip ダウンロードに含まれている標準の Jquery mobile 1.3 ファイルを使用しています。pre

レイアウトには2つのファイルがあります：

doctype 5
html
  head
    title= title
    meta(charset='utf-8')
    meta(name='viewport',content='width=device-width, initial-scale=1')
    meta(name='apple-mobile-web-app-capable',content='yes')
    meta(name='apple-mobile-web-app-status-bar-style',content='black')
    link(rel='stylesheet', href='/pre/jquery.mobile-1.3.0.min.css')
    link(rel='stylesheet', href='/pre/jquery.mobile.structure-1.3.0.min.css')
    link(rel='stylesheet', href='/pre/jquery.mobile.theme-1.3.0.min.css')
    script(src='/pre/jquery-1.9.1.min.js')
    script(src='/pre/jquery.mobile-1.3.0.min.js')

  body
    block content

そして私のコンテンツ：

extends layout
block content
  div#page1(data-role='page')
  div(data-theme='a',data-role='header')
    h3
      | Header
  div(data-role='content')
    a(data-role='button',href='#page1')
      | Button
    a(data-role='button',href='#page1')
      | Button
    a(data-role='button',href='#page1')
      | Button
  div(data-theme='a',data-role='footer',data-position='fixed')
    h3
      | Footer

私が得る問題：

ここに画像の説明を入力

4

1 に答える 1

2

のインデントcontent.jadeが間違っています。以下のすべてをインデントするdiv#page1(data-role='page')と、問題なく機能します

extends layout
block content
  div#page1(data-role='page')
    div(data-theme='a',data-role='header')
      h3 Header
    div(data-role='content')
      a(data-role='button',href='#page1') Button
      a(data-role='button',href='#page1') Button
      a(data-role='button',href='#page1') Button
    div(data-theme='a',data-role='footer',data-position='fixed')
      h3 Footer

ご覧のとおり、パイプを使用しないことでコードを単純化することもできます|

于 2013-03-06T07:29:07.473 に答える