2

我正在关注 Sams 在 24 小时内自学 jquery mobile。但是以下代码不起作用。

我试图调试 javascript 但没有 javascript。如果有一种方法可以调试 jquery mobile 那就太好了。伊苏鲁的简历

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
    <div data-role="page">
        <div data-role="header">
            <h1>Isuru's R&#233;sum&#233;</h1>
        </div>

        <div data-role="content">
            <p>I'm a Mobile Developer with experience in web and android mobile app development. 
                My skills include HTML, CSS, Python, WAMP Development and Java. 
                I also have experience with SEO and Internet Advertising.</p>
            <a href="#contact" data-role="button" data-rel="dialog">Contact me!</a>
        </div>

        <div data-role="page" id="contact" data-theme="c">
            <div data-role="header"><h1>Clicked!</h1></div>
            <div data-role="content">
                <p>Clicked content!</p>
                <a href="#contact" data-rel="back" data-role="button">Go back</a>
            </div>
        </div>  

    </div>

</body>
</html>
4

1 回答 1

2

你的错误很少。

这是一个工作示例：

<!DOCTYPE html>
<html>
<head>
    <title>jQM Complex Demo</title>
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>    
</head>
<body>
    <div data-role="page" id="index">
        <div data-role="header">
            <h1>Isuru's R&#233;sum&#233;</h1>
        </div>

        <div data-role="content">
            <p>I'm a Mobile Developer with experience in web and android mobile app development. 
                My skills include HTML, CSS, Python, WAMP Development and Java. 
                I also have experience with SEO and Internet Advertising.</p>
            <a href="#contact" data-role="button" data-rel="dialog">Contact me!</a>
        </div>
    </div>   

  <div data-role="dialog" id="contact" data-theme="c">
    <div data-role="header"><h1>Clicked!</h1></div>
    <div data-role="content">
      <p>Clicked content!</p>
      <a href="#contact" data-rel="back" data-role="button">Go back</a>
    </div>
  </div>   

</body>
</html>

这是 jsFiddle 示例：http: //jsfiddle.net/Gajotres/w3ptm/

你有这个错误：

  1. 在对话框中 data-role="page"必须是data-role="dialog"

    <div data-role="dialog" id="contact" data-theme="c">
    <div data-role="header"><h1>Clicked!</h1></div>
    <div data-role="content">
        <p>Clicked content!</p>
        <a href="#contact" data-rel="back" data-role="button">Go back</a>
    </div>
</div>

  2. 它还必须与主页处于同一级别。

于 2013-01-14T19:37:09.720 回答