jquery前置问题答案

【问题标题】：issues with jquery prependjquery前置问题
【发布时间】：2011-07-01 13:56:08
【问题描述】：

我不知道为什么这不起作用..

这行得通：

$(this).prepend("<div data-role='header'><h1>Hi</h1></div>");

但是当我这样做时，我的整个页面变为空白（没有加载），但没有错误：

$(this).prepend("<div data-role='header'><a href='link'>Link</a><h1>Hi</h1></div>");

这也不起作用：

$(this).prepend("<div data-role='header'><h1>Hi</h1></div>");
$(this).find('div[data-role=header]').prepend("<a href='link'>Link</a>");

也不是这样：

var string = "<div data-role='header'><a href='link'>Link</a><h1>Hi</h1></div>";
$(this).prepend(string);

这里是重要的情况下的上下文：

$('div[data-role*="page"]').each(function (i) {
    if ($(this).children('div[data-role*="header"]').length != 0) {
        alert("has header");
    } else {
        if (i == 0) {
            var string = "<div data-role='header'><a href='link'>Link</a><h1>Hi</h1></div>";
            $(this).prepend(string);

        } else {
            $(this).prepend("<div data-role='header'><h1>Hi</h1></div>");
        }
        $(this).find('div[data-role=header]').page();
    }
});

我如何让它工作？

【问题讨论】：

我没有看到任何会导致这种行为的东西。如果您用.page() 注释掉该行，它仍然会这样做吗？
当您谈到不工作时，您能否更具体一点？ Javascript错误？意外行为（在这种情况下，描述预期行为以及它与您观察到的行为有何不同）？蓝屏？苹果开始从天上掉下来？还有什么？
请更具体一点：this: $(this).prepend("
Link
嗨

"); " 工作正常。
欢迎使用 jsfiddle 上的小小提琴
这是我正在处理的小提琴的快速尝试：jsfiddle.net/mlms13/xxa6X/1 我不太确定page() 函数应该做什么，所以我将其注释掉。注释掉该行后，它似乎对我来说很好。

标签： jquery append prepend

【解决方案1】：

假设您使用的是 1.4 或更高版本，请尝试使用引入的新元素创建语法动态创建所需的元素：

$('<a />', {
    'href': 'http://www.google.com',
    'target': '_blank',
    'text': 'This is a link',
    'class': 'myClassName',
    'css': {
        'top': '20px'
    }
           }).appendTo('<div />', { 'data-role': 'header' })
             .prependTo($(this));

【讨论】：

【解决方案2】：

我猜你正在使用 jQuery mobile，它似乎在 jsfiddle 上按预期工作。你在什么浏览器上测试这个？

更新了 jsfiddle，使其成为更完整的示例，因此页面转换从第一页开始。

【讨论】：

感谢您的帮助。是的，我正在使用jquery mobile。这很奇怪！我想我的页面中还有其他东西导致它不起作用。正文中的内容正在使用 PHP 加载（基本上它写入另一个文件的内容），并且看起来当我添加该链接部分时，它不会加载任何超过标记的内容。我不知道为什么这些会相关。有什么方法可以调试吗？
不应该 document.ready （我在其中运行该代码）在正文完全加载后运行？因此，无论我在 document.ready 中进行什么更改，正文都没有加载真的没有意义。

【解决方案3】：

根据我的经验，如果在 -tag 中使用 prepend 函数的脚本，它将无法工作，因为该脚本是在 DOM 准备好之前加载的。

为了避免这种挫败感，将 javascript 放在标记之前是一个好习惯。

【讨论】：

嗨