HTML5内容可编辑的DIV焦点

我有一个DIV与<div contentEditable="true" id="content"></div>，我的问题是，在使用JavaScript来发布div的内容后，光标仍在DIV内闪烁，我希望此div在提交其内容后失去焦点，那我怎样才能让光标在提交后从DIV中移除？我已经尝试过在提交之后将模糊设置为此DIV，但无济于事。HTML5内容可编辑的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()数据？

来源

2013-02-15 kabuto178

我想明白了，您需要关注不同的用户文本输入来移动光标，因为在内容可编辑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()将会很好。

希望这会有所帮助！

来源

2013-02-15 02:52:20 Stephen

我正在考虑把重点放在'身体'上，但这并没有奏效，save-button是一个Button元素，它能像DIV一样获得焦点吗？ – kabuto178 2013-02-15 03:03:57

@ kabuto178我这么认为，它有点不同。它通过网页按钮选项卡也会得到重点，但再次，所以做链接。就像我说的，我自己并没有尝试过，但我认为他们可以。 – Stephen 2013-02-15 03:07:09

会给它一个镜头感谢您的建议 – kabuto178 2013-02-15 03:10:40

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

来源

2013-02-15 04:05:16 aWebDeveloper

采取点，我欣赏提示。保持他们的到来大声笑 – kabuto178 2013-02-15 04:11:07

没问题...在这里任何帮助 – aWebDeveloper 2013-02-16 16:27:49

要质疑你的观点上面，是否更好地让点击时也可编辑div？ – kabuto178 2013-02-16 18:42:33

HTML5内容可编辑的DIV焦点

回答

相关问题