0

我的玉！ https://lh4.googleusercontent.com/-hzRqciA1Tjs/UGmc39ijHuI/AAAAAAAAAFk/0XJzY0ZqU70/s720/App.jpg

div(data-role='content')
   div(class='content-primary')
      ul(data-role="listview", data-split-theme='a',data-split-icon='gear')
         li(data-theme='a')
          a(href="")
            div(id='addClientDivId')
          a(href='#', data-icon='delete', title=' Delete ')

我想使用 jquery 动态生成上面的翡翠内容。谁能帮我..？？？

由于我没有声誉，我已将图像截图上传到 picasa。请参阅截图。我已经尝试了下面给出的所有可能性，但无法获得截图上的效果。

回答：

我找到了我的查询的解决方案。

var newContent = '<div data-role="content" data-theme="a" class="content-primary">';
        newContent += '<ul data-role="listview" data-split-theme="a" data-inset="true" id="ulId">';
        newContent += '<li>';
        newContent += '<a href="">';
        newContent += '<h4></h4>';
        newContent += '<h5></h5>';
        newContent += '<a href="" , data-icon="delete">';
        newContent += '</a>';
        newContent += '</a>';
        newContent += '</li>';
        newContent += '</ul>';
        newContent += '</div>';
        $("#addClientDivId").append(newContent).trigger('create');
4

3 回答 3

1

您可以将每个标签构建为单独的 jQuery 对象：

var contentDiv = $('<div></div>').attr('data-role','content');
var contentPrimary = $('<div></div>').attr('class', 'content-primary');
var ul = $('<ul></ul>');
$(ul).attr('data-role', 'listview').attr('data-split-theme', 'a').attr('data-split-icon','gear');

然后将您的 li(s) 添加到您的 ul ..

for(..) {
   var li = $('<li></li>');
   var liContent = $('<a></a>').attr('href', 'a');
   // You can build the rest of your li content here.

   // Append the li content to the li
   $(li).append(liContent);

   // And then append the li to the ul
   $(ul).append(li);
}

完成 ul 后，您可以编写其余部分。

$(contentPrimary).append(ul);
$(contentDiv).append(contentPrimary);

然后将所有内容添加到 DOM 中，比如说在 body 内部

$('body').append(contentDiv);

为了提高性能，您可以将整个结构构建为字符串（与 '+' 连接），然后将其添加到 DOM。

var contentDivAsString = '<div data-role="content">....</div>';
$('body').append($(contentDivAsString));

任何一种方法都行得通，只是第二种方法的性能更高，并且您将使用更少的对象来完成它。

于 2012-10-01T12:02:13.887 回答
0

你可以试试这个

var aMain=$('<a/>', {
    'text':'Delete',
    'href':'',
    'data-icon':'delete',
    'title':' Delete '
});
var acDivid=$('<div id="addClientDivId"></div>');
var a=$('<a href=""></a>');
var li=$('<li data-theme="a"></li>');
var ul=$('<ul />', {
   'data-role':'listview',
   'data-split-theme':'a',
   'data-split-icon':'gear'
});
var cP=$('<div class="content-primary"></div>');
var content=$('<div data-role="content"></div>');
$('body').append(content.append(cP.append(ul.append(li.append(a.append(acDivid.append(aMain)))))));

演示。

于 2012-10-01T12:41:04.307 回答
0

只需将 html 保存在这样的字符串中：content = "<div data-role='content'">[...]</div>如果您只想将其添加到正文中$("body").append(content)

否则请查看有关选择器的文档：http: //api.jquery.com/category/selectors/

于 2012-10-01T11:43:57.890 回答