2012-08-01 94 views
0

http://jsfiddle.net/kCMvt/为什么这个JQuery不能转换?

嘿大家。我为手机制作了这个jQuery页面,但是转换只是不正确,我认为我已经做好了一切准备。我几乎查看了另一个示例中的代码并使用了相同的代码,但不确定它为什么不转换。有很多CSS,因为我从jQuery主题滚轮获得了这个,所以这就是为什么它有点过分。我并没有太多的jQuery专家来做我自己的东西,但我无法想象它实际上是复杂的来想到它。

此HTML不过渡:

<!DOCTYPE html> 

<html> 

    <head> 

     <meta charset="utf-8"> 

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

     <title>jQuery Mobile: Theme Download</title> 

     <link rel="stylesheet" href="themes/test1.min.css" /> 

     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile.structure-1.1.1.min.css" /> 

     <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 

     <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script> 

    </head> 

    <body> 

     <div data-role="page" data-theme="a"> 

      <div data-role="header" data-position="inline"> 

      <div> 

       <h1 style="font-size:16px;text-align:center;">Random Question</h1> 

       </div> 

      </div> 

      <fieldset data-role="controlgroup"> 



       <input type="radio" name="radiochoice" id="radio-choice-1" value="choice-1" checked="checked" /> 

       <a href="#page2"><label for="radio-choice-1">Yes</label></a> 



       <input type="radio" name="radio-choice" id="radio-choice-2" value="choice-2" /> 

       <a href="#page2"><label for="radio-choice-2">No</label></a> 

      </fieldset> 

      <div data-role="content" data-theme="a"> 

       <p style="text-align:center;font-weight:bold;color:#003366;">blablablab bla</p> 

      </div><!-- end content --> 







      <div data-role="footer"> 

      <h4>cool footer</h4> 



     </div><!-- end page --> 



<!-- start of 2nd page --> 

<div data-role="page" id="page2"> 



<div data-role="header"> 

    <h1>Thanks For Your Opinion!</h1> 

</div><!-- end header --> 



<div data-role="content"> 

    <p>Page Content</p> 

</div> 



<div data-role="footer"> 

    <h4>Copyright</h4> 

    </div><!-- end footer --> 

</div><!-- end page --> 



    </body> 

</html>​ 
+0

您发布的小提琴中没有剧本 – Andre 2012-08-01 01:44:01

+0

确定吗?它为我工作... – king 2012-08-01 01:48:52

+0

请确保你点击jsfiddle上的更新按钮来保存你最近的。 – DigTheDoug 2012-08-01 01:53:57

回答

0

对于初学者来说,你缺少第一个脚注(或页面)结束标记:

<div data-role="footer"> 
     <h4>cool footer</h4> 
    </div> 
    </div><!-- end page --> 

然后,你可以换整输入,而不仅仅是标签,在一个链接:

<a href="#page2"> 
     <input type="radio" name="radiochoice" id="radio-choice-1" value="choice-1" checked="checked" /> 
     <label for="radio-choice-1">Yes</label> 
    </a> 
    <a href="#page2"> 
     <input type="radio" name="radio-choice" id="radio-choice-2" value="choice-2" /> 
     <label for="radio-choice-2">No</label> 
    </a> 

Here is a working jsFiddle

另外,你应该考虑发布更好的格式化代码。适当的缩进可以使丢失的标签更容易被识别出来,并且当你的代码被格式化时,它会让那些试图阅读代码的人变得更加困难。