Question

我有一个<div contentEditable="true" id="content"></div>的DIV，我的问题是在使用javascript发布div的内容后，光标仍然在DIV内闪烁，我希望这个div在提交其内容后失去焦点，是如何在提交后将光标从DIV中删除？我已经尝试在提交后将模糊设置为此DIV但无效。

    $('.save-button').on('click',function(){
    var newBio = $("#content").text();
    newBio = $.trim(newBio);

    $.post(postdatahere,
            function(data) {
            $("#content").blur();
            $('.save-button').hide();
        });
});

此外，使用.text()从可编辑的DIV或.html()获取数据是否更好？

Answer 1

您可以尝试在ajax请求之前在提交/上创建div，并在其/ ajax请求结束后启用编辑。无论天气如何，都需要这样做才能解决您的问题，因为这是一个很好的做法。

Answer 2

我想通了，你需要聚焦不同的用户文本输入来移动光标，因为光标在内容可编辑div模糊后停留在那里。

所以你的代码看起来像这样：

    $('.save-button').on('click',function(){
    var newBio = $("#content").text();
    newBio = $.trim(newBio);

    $.post(postdatahere,
            function(data) {
            $("#SomeUserInput").focus();
            $(".save-button").focus();
            $('.save-button').hide();
        });
});

虽然.save-button不应该是一个id而不是一个类？如果是这样的话就是

    $.post(postdatahere,
            function(data) {
            $("#SomeUserInput").focus(); //blur #content by focusing on different element
            $('#save-button').focus(); // focus on the button to remove focus from #SomeUserInput and because it is going to be hidden anyways.
            $('#save-button').hide();
        });
});

（是的，这有点像黑客。）

当涉及到使用.text()还是.html()时，它取决于您的需求。如果你想要样式（斜体，粗体字等），你会想要使用.html()，但如果你这样做，请确保你有一个某种类型的服务器端过滤器，这样你就不会得到任何不好的脚本网站。否则，.text()会很好。

希望这有帮助！

HTML5内容可编辑的DIV焦点

2 个答案: