使用 jQuery 选择器和 setSelectionRange 不是函数
Posted
技术标签:
【中文标题】使用 jQuery 选择器和 setSelectionRange 不是函数【英文标题】:Using jQuery selector and setSelectionRange is not a function 【发布时间】:2013-06-14 01:44:58 【问题描述】:我在下面组装了一个基本的 jfiddle。出于某种原因,我的选择器可以检索 textarea 框以设置值,但选择器无法使用 setSelectionRange 函数。在控制台上,您会发现 .setSelectionRange is not a function 的错误。
http://jsfiddle.net/dMdHQ/6/
代码(请参考jfiddle):
selector.setSelectionRange(carat,carat);
【问题讨论】:
【参考方案1】:setSelectionRange(carat,carat)
不是 jquery 对象的方法。您想在 DOM 元素上使用它。所以试试:
selector[0].setSelectionRange(carat,carat); //use `[0]` or .get(0) on the jquery object
见Reference
Fiddle
【讨论】:
如果能解决您的问题,请标记为正确答案 即使在小提琴中,我仍然会得到“selector.setSelectionRange 不是函数”。我正在使用铬。【参考方案2】:对我来说这是一个很好的解决方案
selector[0].setSelectionRange(start ,end);
但我想再补充一件事。我注意到setSelectionRange
是在元素获得焦点后异步变为可用的东西。
var element = selector[0];
element.addEventListener('focus', function()
element.setSelectionRange(start, end);
);
element.focus();
你也可以选择使用:
element.selectionStart = start;
element.selectionEnd = end;
【讨论】:
【参考方案3】:html:
<input type="search" value="Potato Pancakes" id="search">
查询:
jQuery.fn.putCursorAtEnd = function()
return this.each(function()
$(this).focus()
// If this function exists...
if (this.setSelectionRange)
// ... then use it (Doesn't work in IE)
// Double the length because Opera is inconsistent about whether a carriage return is one character or two. Sigh.
var len = $(this).val().length * 2;
this.setSelectionRange(len, len);
else
// ... otherwise replace the contents with itself
// (Doesn't work in Google Chrome)
$(this).val($(this).val());
// Scroll to the bottom, in case we're in a tall textarea
// (Necessary for Firefox and Google Chrome)
this.scrollTop = 999999;
);
;
$("#search").putCursorAtEnd();
检查:
http://css-tricks.com/snippets/jquery/move-cursor-to-end-of-textarea-or-input/
【讨论】:
【参考方案4】:你可以试试这个对我有用的。我用它从单独的地址字段中构建一个地址,然后复制粘贴。
HTML
<div id="d_clip_container" style="position:relative">
(<a href="#" id="d_clip_button">copy to clipboard</a>)
</div>;
<textarea id="clip" rows="0" cols="0" style="border:none;height:0;width:0;"></textarea>
jQuery
$(document).ready(function()
$('#d_clip_button').click(function()
//get all the values of needed elements
var fName = $("#firstName").val();
var lName = $("#lastName").val();
var address = $("#Address").val();
var city = $("#City").val();
var state = $("#State").val();
var zip = $("#Zip").val();
//concatenate and set "clip" field with needed content
$('#clip').val(fName + " " + lName + "\n" + address + "\n" + city + ", " + state + " " + zip);
//Do it
if(copyToClipboard('#clip'))
alert('text copied');
else
alert('copy failed');
);
);
function copyToClipboard(elem)
// set focus to hidden element and select the content
$(elem).focus();
// select all the text therein
$(elem).select();
var succeed;
try
succeed = document.execCommand("copy");
catch(e)
succeed = false;
// clear temporary content
$(target).val('');
return succeed;
【讨论】:
以上是关于使用 jQuery 选择器和 setSelectionRange 不是函数的主要内容,如果未能解决你的问题,请参考以下文章