How does a TWEET composition textbox work?

The Twitter input box is much more than your average INPUT or textarea. First off, it isn't an input or textarea at all. They are instead using a well crafted DIV with a "role" attribute. for the entire text; likely capturing keystokes as they occur.

If a user is logged in, they can compose a tweet. If during that very cautious 140 character sprint, they accidentally click somewhere on the page, the browser GETs another page.

But when the user hits "back", the DIV then repopulates (after a second), with the users partially drafted tweet.

In terms of browser capability, how is this "saved form field" being accomplished?


I'm guessing to achieve this, one could implement either:

  • local-storage This would just involve writing to the local storage upon each keystroke. Upon loading the page, the JS populates the tweet composer with the session local storage. See a live example of utilizing local storage. This would be nice and slick, but a major limitation is that this is limited to HTML5 browsers.
  • AJAX callback Similar to the first method, but instead of writing to local-storage, the draft tweet is written to a web service. Upon loading the page, a callback is made to retrieve the content; populating the tweet composer.

  • Cookie approach. Similar to the local-storage, but would write to cookie cache. The benefit with this method might be more ubiquitous browser support.

  • I'd love for someone to explain the pro's/con's of each method along with some sample code. Bonus if it's under 140 characters for each code sample :) (j/k).

    链接地址: http://www.djcxy.com/p/36632.html

    上一篇: 自动订购注入的元素

    下一篇: TWEET组合文本框如何工作?