am having one task in epub (i.e) quiz .so the problem what iam phasing is,once the user read the question means he enter his answer in text box. so the problem is text box does not show the key pad for typing the answer.is any some other solution for this problem using java script?.is it possible
you can add javascript or a javascript plugin like jquery but there are some changes you will have to make to your code. I added a flex slider with just a few changes. First take out the leading xml call in the html file then use a cdata wrap for your script. If you go to my youtube channel I did a couple of videos on it about a year ago. http://www.youtube.com/watch?v=geAnFKbW9wI
Hope this helps.
You can use like below, am using this for interactive FL books.
<div contenteditable="true">_</div>
and also you can refer this for contenteditable change events.
Related
I'm trying to have a textarea input field just like when you post a new StackOverflow question. You can have line spaces, you can bold text, you can insert link etc.
However, when you push some kind of button, all of that gets translated into a long HTML string (e.g., spaces become <p> or <br>, bold becomes <strong>, link becomes <a>). Is there a way to do this with some kind of JS plug in?
What you describe is a What You See Is What You Get (WYSIWYG) editor.
Google "WYSIWYG editor library"
Examples:
https://prosemirror.net/
https://www.tinymce.com/
This question has been answered here Rendering HTML inside textarea
What you need is WYSIWYG (What you see is what you get) editor.
There are a lot of them.
You can check out these:
Ckeditor The best web editor for everyone
TinyMCE Full featured web editing
They are very easy to use.
If I have understood what you are asking, you will need to learn regular expressions. Everything is the context is based on text replacement.
Example: because textarea does not display hyperlinks, buttons, i can do somethings like in stackoverflow.
For hyperlink, i can write something link [# http://facebook.com] or [link]http://facebook.com [link];
later, I extract the http://facebook.com and wrap it between <a></a> elements.
What everybody above said is true, you want to be looking at a WISYWG editor.
If by chance you are using Bootstrap, you may want to look at Summernote.
I have no affiliation with them, but I used it for one of my projects and was very pleased.
I am rather curious.
When a member is asking a question in Stack Overflow, within a textbox, the member can enter tags which will change into a graphical form automatically. There is even an 'X' button to the side of each tag which will allow the tag to be deleted.
How is this implemented in HTML? I thought only pure text is allowed in a textbox.
The tag system is quite easy to do with a jquery library. Check these out:
http://xoxco.com/projects/code/tagsinput/
http://aehlke.github.io/tag-it/
https://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/
and so on ...
Only text is allowed in a textfield, you're right.
The Tags field, when you're asking a question on this site, is actually a <div> which looks like a textfield. Then, it's a matter of CSS and JavaScript to manage inserting and removing the tags. You could use web-inspector to study the HTML structure and css/js codes.
Viewing source of the tags may give some idea:
I have an web application which displays data in text boxes/textareas (tonnes of them).
Changing this web application to use <div>s is really out of the question as it would cost more than the gain of implementing ACE.
I have tried to create an example which would load the ACE editor inside a FancyBox when clicking on the textarea/text box.
My example is here: http://jsfiddle.net/espenfjo/tHqGd/5/
The problem is however that it doesn't seem like the ACE javascript can find the new this.content.
edit: Of course.. other solutions to how to make fancy text boxes/textares with ACE would also be very welcome.
I went by using $(".fancybox-inner")[0] instead of using an own <div> for this.
Like this: http://jsfiddle.net/espenfjo/tHqGd/8/
Now I can click a textarea (or whatever really), and get a fancybox with the ACE editor updating the textarea.
I would like to add 'span' tag on the beginning and '/span' on the end of each line of text as it is presented in the website and change it dynamically when a div containing such text is resized. The problem is that I don't know how to detect where the text is being wrapped - if I had such information it would be easy. So my question is: is there a way to determine where the text is wrapped using javascript?
I have found a javascript library which hyphenates the text in the site but I'm not sure how does it detect line wraps. The working example is here and it's source can be found here.
yes, this is like to Search For and Highlight Text.
using javascript you can learn it here:
Search For and Highlight Text
or here:
how-can-i-use-jquery-to-style-parts-of-all-instances-of-a-specific-word
just download/save the web page there and you can learn it.
I'm exploring the idea of using contenteditable on a website at visitor comments and at a message board.
As I only wish to accept a white-list of HTML tags and attributes the question of when and how should I validate the entered HTML content comes up.
How would you do it? What cross-browser solutions would you choose to use? What events could be useful?
HTML Purifier is getting momentum these days.