0

HTML5、Jquery（v1.6.4）およびJquery-mobile（jquery.mobile-1.0.1.js）を使用しています。

Jqueryを使用して動的にデータを入力したい。入力した後、ページが正しく表示されません。Jquery-mobileのテーマとスタイルシートはページに影響しません。

コード

Test.html

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="jquery.mobile-1.0.1.css" type="text/css" charset="utf-8">
<link rel="stylesheet" href="jquery.mobile.structure-1.0.1.css" type="text/css" charset="utf-8">

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript"src="jquery.mobile-1.0.1.js"></script>
<script src="main.js" type="text/javascript" charset="utf-8"></script>

<title>Test</title>
 </head>
  <body>
        <div id="test"> </div>
</body>
</html>

main.jsコード

 $(document).ready(function(){

    $("#test").append("<ul data-role='listview'>"); 
    $("#test").append("<li>Srikanth</li>");
    $("#test").append("<li>Chil</li>");
    $("#test").append("<li>Devi</li>");
    $("#test").append("</ul>");
 });

これについて私を助けてください。

4

3 に答える 3

1

liに要素を追加#testしているだけでなく、不正な形式の要素（の開始タグと終了タグul）も追加しています。

要素を要素に追加してから、それをli要素に追加する必要があります。ul#test

（append（）はDOMで機能し、HTMLコードを文字列のように要素に挿入するだけではありません。）

したがって、次のようになります。

var ul = $("<ul data-role='listview'></ul>");
ul.append("<li>foo</li>");
ul.appendTo("#test");
于 2012-06-14T08:56:10.490 に答える
1

リストを動的に作成しているので、jQuery Mobileにそのことを伝え、コンテンツを「拡張」するように依頼する必要があります。これを行うには、

$("changed-parent-element").listview("create");

要素を追加する既存の拡張リストがある場合は、JQMに、呼び出して新しいコンテンツを拡張するように指示する必要があります。

$("changed-parent-element").listview("refresh");
于 2012-06-14T09:09:14.967 に答える
0

ファイルの絶対パスを使用するか、少なくとも./を使用して現在のフォルダからロードしてください

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="./jquery.mobile-1.0.1.css" type="text/css" charset="utf-8">
<link rel="stylesheet" href="./jquery.mobile.structure-1.0.1.css" type="text/css" charset="utf-8">

<script type="text/javascript" src="./jquery.js"></script>
<script type="text/javascript"src="./jquery.mobile-1.0.1.js"></script>
<script src="./main.js" type="text/javascript" charset="utf-8"></script>

<title>Test</title>
 </head>
  <body>
        <div id="test"> </div>
</body>
</html>
于 2012-06-14T08:58:24.297 に答える