Question

所以我试图在用户点击“Go”之后和新页面加载之前立即在RichText编辑器中添加徽标。

$('#Go').on('click', function (e) {
    e.preventDefault();
    $.get(url, function(data) {
        var html = '<img src="' + data + '" width=100px height=100px></img>';
        $('.EditorFrame').contents().find('body').append(html);
    });
});

就像我点击“Go”一样，在加载新页面之前，图像会短暂出现在编辑器中。新页面 - 只显示我们编辑的结果空白！我也用纯文本尝试了这个 - 同样的故事。

我努力调试。例如，放置：

console.log($('.EditorFrame').contents().find('img'));

紧跟在追加行后的

会打印出img标签！

有趣的是，当我在控制台中复制/粘贴相同的代码然后按“开始”时，一切正常，我可以看到图像，文本，无论我放在编辑器中。

我正在使用最新的Google Chrome浏览器。

Answer 1

您正在竞争异步get方法和下一页加载。您可能应该在点击处理程序中返回false并在get请求的成功回调中转到下一页（如果这是您想要的）：

$('#Go').on('click', function (e) {
    e.preventDefault();
    $.get(url, function(data) {
        var html = '<img src="' + data + '" width="100" height="100"></img>';
        $('.EditorFrame').contents().find('body').append(html);
        // go to next page here
    });
    return false;
});

此外，width和height属性不应具有“px”，而应仅为数值

JQuery append在JQuery单击函数中不起作用

1 个答案: