I want to know if it is possible to select the text anywhere on a webpage and then copy it using jQuery or Javascript.In another language how to invoke CTRL+X,CTRL+C and CTRL+V on a selected text using jQuery or Javascript?.Can this be done?However the CUT command will be invoked on the text which is present in a textarea or textbox not on the hypertext of the webpage. Please let me know.
You could probably invoke the buttons, and copying text on a webpage is most certainly possible with access to the DOM, however it seems like what you are trying to do is access the clipboard, and the way to do that consistently is usually with flash.
The ZeroClipboard plugin is the one most commonly used, it's easy to integrate and gives you full access ro the clipboard.
For an example have a look at CSS3Please, I believe they are using the ZeroClipboard plugin.
Can this be done?
...
I don't want to use Flash
No, not if you need it to work in all major browsers.
Related
What is the recommended way to implement accessibility to copy text from within a <p> element?
For example,
<p class='text'>Some text to copy</p>
The <p> element is a inserted into DOM via AJAX call. What ARIA tags needs to be applied so that when it is being generated and inserted it becomes accessible to the user to copy easily.
All ideas appreciated.
There are at least two good ways to do this:
Make your <p> a <textarea readonly> instead. Thus a user would freely navigate through the text in the textarea if he/she wants, and he/she is also able to copy everything at once just by pressing Ctrl+A.
You can place a «Copy to clipboard» link or button. There is an IE-only solution with window.clipboardData, however in 2014 this is kinda ridiculous because blind users (among others) use different browsers, including (but not restricting to) IE, Firefox, Chrome, and Safari.
However, I saw on different websites a button implemented using Flash. So you can use this if you manage to deal with it.
You can see more info about the flash solution in the first answer to this question and following the links provided there.
I did not remove <p> but ended up using a <input> under <p> with z-index:-1;. It solved two problems for me:-
Keeping focus on the newly inserted role=dialog modal.
Kept the text selected for a challenged user to copy.
I am sure there are better ways to do it. But for now it works for me.
I am trying to write an automation tool for a browser game that takes some data from the web page, in this case the data appears to be added using JS after the page has loaded, I assume this is where my issue is.
I'm trying to grab the text that the JS adds and save it to a variable, but when I try and find it using the WebBrowser component's DOM controls, it cannot find the text I need. The text IS there, you can see it on the browser window and the source should easily be found as I can see it when using Chrome's dev console/inspect element tool, when I target it using the DOM controls, VS makes it clear that it can't find it. I am 100% certain I was targeting it right and that I'm not pointing it in the wrong direction.
Is there a way for the WebBrowser to refresh/re-read the source without refreshing the page?
Otherwise, how would you go about working around this?
Cheers,
Tom.
One work around that springs to mind when puling text from something is to use MS Office document imaging. If the text always appears in a specific location on a page it should just be a question of taking a print screen of where the text appears and then running it thought to OCR. The advantage of this is it's pretty future proof, the game makes could change the method by which they display the text but as long as it's displayed you should be able to print screen it. :)
I'm trying to implement a user-friendly way to copy some text from a text input field to the clipboard on iOS/Safari. I understand there is no way to programmatically do it on this platform, but I was hoping I could guide the user experience as much as possible.
On iOS/Safari, when a user manually highlights some text, a contextual Copy menu pops up. I was hoping the same menu would pop up when the text is selected programmatically, but it doesn't. Is it even possible to do that?
If not, any advice on how to best implement a user-friendly experience to copy some text to the clipboard on iOS/Safari?
For reference, I'm selecting the text using the method described in this question:
Programmatically selecting text in an input field on iOS devices (mobile Safari)
It's not possible unfortunately. I'd include some informative text below the input, hopefully that will work out okay in terms of user-friendliness.
Another option would be to go native, e.g. by wrapping using PhoneGap, but I guess you are already well aware of that option. If so, something like this would work in native code:
[UIPasteboard generalPasteboard].string = #"your string";
From javascript it is possible with the help of iOS (objective C).
var getVal = $("#textid").val();
localStorage.setItem("getVal",getVal);
and then you can use your native code for getting this value from local storage.
I haven't knowledge of objective C but you can use that's method after js code.
I am wanting to create fancy "text-areas" like typeit.org has. I'm pretty sure they use iFrames with the iFrame doument's contentEditable value set to true, but how might the symbol buttons work? When using this technique, how do you replace the current selection inside the iFrame with a symbol or if nothing is selected, insert the symbol to the left of the cursor?
http://currencies.typeit.org/
When using an iFrame as a Rich Text Editor, you can tell the iFrame to enable design mode and execute commands.
To enable design mode (allowing the user to edit the iframe), you can use this snippet:
document.getElementById("myiframe").document.designMode="on";
Then to execute a command when the user clicks a button, you simply use this code snippet:
var textEditor = document.getElementById("myiframe");
textEditor.document.execCommand(x,"",y);
textEditor.focus();
Where x is the command and y is the value. For more information on available commands, look at MSDN. I believe OverWrite provides the functionality that you see in TypeIt; but I could be wrong, I'll look into it and update my answer.
EDIT: As #TimDown suggested: IE does not support insertHTML, so in order to do the equivalent in IE, use textEditor.document.selection.createRange().pasteHTML("some HTML").
I am using CKEditor as a rich text WYSIWYG Javascript editor.
I would like to add an on-screen keyboard so that they can easily enter text from non-English alphabets.
I was planning on finding a JavaScript on-screen keyboard and adding a custom button with a CKEditor plug-in to trigger it.
I've found a couple of JavaScript on-screen keyboards. I like the one that Google provides best. The problem is that it needs to be bound to an HTML <textarea>. As far as I can tell CKEDitor uses an iFrame and has no <textarea>. Does anyone have any ideas for how to work around this problem? Is there a way I can bind the keyboard to the CKEditor "<textarea>"? Or is there an on-screen keyboard that doesn't need to be bound to anything?
Thanks!
You can try this one
http://debugger.ru/demo/projects/virtualkeyboard/richedit/ckeditor/plugins/Jsvk/examples/sample.html
There you'll see development release, but shortly it will be replaced with production one.
Project page: http://sf.net/prokects/jsvk/