抓住粘贴input
我正在寻找一种方法来清理我粘贴到浏览器的input,这可能与jQuery有关吗?
我已经设法到目前为止:
$(this).live(pasteEventName, function(e) { // this is where i would like to sanitize my input return false; }
不幸的是,由于这个“小问题”,我的发展已经到了一个令人窒息的地步。 如果有人能指出我正确的方向,我真的会让我成为一个快乐的露营者。
好吧,碰到同样的问题..我走了很长的路
$('input').on('paste', function () { var element = this; setTimeout(function () { var text = $(element).val(); // do something with text }, 100); });
只是一个小超时,直到.val()func可以得到填充。
E.
对于跨平台兼容性,应该处理oninput和onpropertychange事件:
$ (something).bind ("input propertychange", function (e) { // check for paste as in example above and // do something })
你可以直接从事件中获取价值。 尽pipe如此,但它有一点钝。
如果你不想让它通过,则返回false。
$(this).on('paste', function(e) { var pasteData = e.originalEvent.clipboardData.getData('text') }
我有点通过使用下面的代码修复它:
$("#editor").live('input paste',function(e){ if(e.target.id == 'editor') { $('<textarea></textarea>').attr('id', 'paste').appendTo('#editMode'); $("#paste").focus(); setTimeout($(this).paste, 250); } });
现在我只需要存储插入的位置,并追加到该位置,然后我都设置…我想:)
嗯…我想你可以使用e.clipboardData
来捕捉正在粘贴的数据。 如果它不能平移,看看这里 。
$(this).live("paste", function(e) { alert(e.clipboardData); // [object Clipboard] });
监听粘贴事件并设置一个keyup事件监听器。 在keyup上,捕获值并删除keyup事件侦听器。
$('.inputTextArea').bind('paste', function (e){ $(e.target).keyup(getInput); }); function getInput(e){ var inputText = $(e.target).val(); $(e.target).unbind('keyup'); }
这越来越接近你想要的。
function sanitize(s) { return s.replace(/\bfoo\b/g, "~"); }; $(function() { $(":text, textarea").bind("input paste", function(e) { try { clipboardData.setData("text", sanitize(clipboardData.getData("text")) ); } catch (e) { $(this).val( sanitize( $(this).val() ) ); } }); });
请注意,当找不到剪贴板数据对象(在IE浏览器以外的其他浏览器),你正在获取元素的完整值+剪贴板的值。
如果你真的只是在数据被真正粘贴到元素之后,你可能会做一些额外的步骤来区分这两个值,在input之前和之后。
比较场地的原始价值和场地价值的变化情况,扣除差价作为粘贴价值? 即使字段中存在文本,也会正确捕获粘贴的文本。
function text_diff(first, second) { var start = 0; while (start < first.length && first[start] == second[start]) { ++start; } var end = 0; while (first.length - end > start && first[first.length - end - 1] == second[second.length - end - 1]) { ++end; } end = second.length - end; return second.substr(start, end - start); } $('textarea').bind('paste', function () { var self = $(this); var orig = self.val(); setTimeout(function () { var pasted = text_diff(orig, $(self).val()); console.log(pasted); }); });
$('').bind('input propertychange', function() {....});
这将适用于鼠标粘贴事件。
$("#textboxid").on('input propertychange', function () { //perform operation });
它会正常工作。
此代码正在为我工作,从右键单击粘贴或直接复制粘贴
$('.textbox').on('paste input propertychange', function (e) { $(this).val( $(this).val().replace(/[^0-9.]/g, '') ); })
当我粘贴Section 1: Labour Cost
在文本框中变成1
。
为了只允许float值,我使用这个代码
//only decimal $('.textbox').keypress(function(e) { if(e.which == 46 && $(this).val().indexOf('.') != -1) { e.preventDefault(); } if (e.which == 8 || e.which == 46) { return true; } else if ( e.which < 48 || e.which > 57) { e.preventDefault(); } });
看到这个例子: http : //www.p2e.dk/diverse/detectPaste.htm
它必须跟踪oninput事件的每一个变化,然后通过string比较来检查它是否是一个粘贴。 哦,在IE浏览器中有一个onpaste事件。 所以:
$ (something).bind ("input paste", function (e) { // check for paste as in example above and // do something })
document.addEventListener('paste', function(e){ if(e.clipboardData.types.indexOf('text/html') > -1){ processDataFromClipboard(e.clipboardData.getData('text/html')); e.preventDefault(); ... } });
进一步:
- 剪贴板API和事件
这个方法使用jquery的内容()。unwrap()。
- 首先检测粘贴事件
- 为已经粘贴到元素中的标签添加一个唯一的类。
-
在给定的超时扫描完所有内容之后,展开没有设置的类的标签。 注意:此方法不会移除自闭合标签
看下面的例子。//find all children .find('*') and add the class .within .addClass("within") to all tags $('#answer_text').find('*').each(function () { $(this).addClass("within"); }); setTimeout(function() { $('#answer_text').find('*').each(function () { //if the current child does not have the specified class unwrap its contents $(this).not(".within").contents().unwrap(); }); }, 0);
这被certificate是相当虚幻的。 在执行粘贴事件函数内部的代码之前,input的值不会被更新。 我尝试从paste事件函数中调用其他事件,但input值仍然没有用任何事件的函数内部的粘贴文本更新。 这是除键控之外的所有事件。 如果您从粘贴事件function中调用密码,则可以清除密码事件函数中粘贴的文本。 像这样…
$(':input').live ( 'input paste', function(e) { $(this).keyup(); } ); $(':input').live ( 'keyup', function(e) { // sanitize pasted text here } );
这里有一个警告。 在Firefox中,如果重置每个键盘上的input文本,如果文本比input宽度允许的可查看区域更长,则重置每个键上的值会打断浏览器的function,即自动将文本滚动到位于文本结尾。 相反,文本滚动回到开始,脱离目光。
使用类portlet-form-input-field从所有字段中删除特殊字符的脚本:
// Remove special chars from input field on paste jQuery('.portlet-form-input-field').bind('paste', function(e) { var textInput = jQuery(this); setTimeout(function() { textInput.val(replaceSingleEndOfLineCharactersInString(textInput.val())); }, 200); }); function replaceSingleEndOfLineCharactersInString(value) { <% // deal with end-of-line characters (\n or \r\n) that will affect string length calculation, // also remove all non-printable control characters that can cause XML validation errors %> if (value != "") { value = value.replace(/(\x00|\x01|\x02|\x03|\x04|\x05|\x06|\x07|\x08|\x0B|\x0C|\x0E|\x0F|\x10|\x11|\x12|\x13|\x14|\x15|\x16|\x17|\x18|\x19|\x1A|\x1B|\x1C|\x1D|\x1E|\x1F|\x7F)/gm,''); return value = value.replace(/(\r\n|\n|\r)/gm,'##').replace(/(\#\#)/gm,"\r\n"); } }
这里有一个警告。 在Firefox中,如果重置每个键盘上的input文本,如果文本比input宽度允许的可查看区域更长,则重置每个键上的值会打断浏览器的function,即自动将文本滚动到位于文本结尾。 相反,文本滚动回到开始,脱离目光。
function scroll(elementToBeScrolled) { //this will reset the scroll to the bottom of the viewable area. elementToBeScrolled.topscroll = elementToBeScrolled.scrollheight; }