我有一个输入字段供用户插入他们自己的 wordpress 简码。我想要字符[
并将]
它们的文本环绕在输入框中。我不希望他们能够移除括号,他们应该一直在那里。
例如,当他们第一次到达页面时,在输入框中只有这个,[]
然后当他们专注于该文本框时,光标应该停留在括号之间,并且他们不应该能够删除括号。
我有一个输入字段供用户插入他们自己的 wordpress 简码。我想要字符[
并将]
它们的文本环绕在输入框中。我不希望他们能够移除括号,他们应该一直在那里。
例如,当他们第一次到达页面时,在输入框中只有这个,[]
然后当他们专注于该文本框时,光标应该停留在括号之间,并且他们不应该能够删除括号。
更新
出于某种原因,我无法让这段代码在 jsFiddle 中工作,但我已经在以下浏览器中广泛测试了这段代码:
Chrome 版本 30.0.1599.101 m - 工作
火狐 19 - 工作
火狐 24 - 工作
Safari 5.1.7 - 工作。
IE10 - 工作
IE9 - 工作
IE8 - 部分工作(无法选择括号之间的文本)
IE7 - 部分工作(无法选择括号之间的文本)
我确实发现在使用 createTextRange 函数时,旧版本的 IE 存在潜在的安全问题,这可能是代码在这些版本中不起作用的原因。
对发布的原始代码进行了几处更改。
<head>
<title></title>
<script>
var setBrackets = function (elem) {
var text = elem.value;
text = text.replace("[", "").replace("]", "");
text = "[" + text + "]";
elem.value = text;
};
var selectRange = function (elem) {
var endPos = elem.value.length - 1;
var startPos = 1;
window.setTimeout(function () {
if (typeof elem.selectionStart === "number") {
elem.selectionStart = startPos;
elem.selectionEnd = endPos;
} else if (typeof elem.createTextRange !== "undefined") {
elem.focus();
var range = elem.createTextRange();
range.collapse(true);
range.select();
}
}, 1);
}
function checkEmpty(elem) {
if (elem.value.length > 2) {
setBrackets(elem);
selectRange(elem);
}
else {
selectRange(elem);
}
}
</script>
<style>
</style>
</head>
<body>
<input type="text" id="test" value="[]" onblur="setBrackets(this)" onfocus="checkEmpty(this)"/>
</body>
我希望这对你有用。如果有什么可以帮助您的,请告诉我。
谢谢。
这是一个快速解决方案,当您需要在文本字段/电话号码字段中添加括号时
http://ashfaqahmed.net/jquery-add-prefix-postfix-on-phone-number-field/