开发者

Is it advisable to use ContentEditable for a web form?

开发者 https://www.devze.com 2023-03-28 07:01 出处:网络
I want to make a form type of editor that edits the text right on the page and commits changes on cursor-out of each field. There\'s no font or style alteration, just straight boxes.

I want to make a form type of editor that edits the text right on the page and commits changes on cursor-out of each field. There's no font or style alteration, just straight boxes.

I saw some things like JEditable But the boxes and the ne开发者_运维技巧ed to press 'ok' to commit seems slightly unattractive and unintuitive.

I was wondering about just applying contentEditable="true" to each element.. I imagine that will achieve the same thing. Since it wouldn't be a form with inputs, though, I would have to submit changes via javascript, I'd imagine, but that's workable for my situation. (it also seems somewhat more straightforward than worrying about javascript for every element like with JEditable or something similar.

Is that a reasonable solution? I'm not worried about mobile browser support for this particular part of the site (hopefully iOS5 will support it though or something...).


Code wise it would need to look something like this:

$(".YourElementClassHere").click(function () { 
   $("#YourTextArea").position($(this).position());
   $("#YourTextArea").css("display", "block");
});

$("#YourTextArea").click(function() {
  if ( event.which == 13 ) {
     $("#YourTextArea").css("display", "none");
     // Do something to commit this: $("#YourTextArea").text();
  }
});

This is jQuery syntax btw, for anyone that shouldn't know this. I hope this helps, seeing as I am a bit rusty, this javascript might need a bit of alteration.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号