Question

我有一个输入字段供用户插入自己的wordpress短代码。我希望字符[和]能够在输入框内包围它们的文本。我不希望他们能够移除括号，他们应该永远在那里。

例如，在输入框中，当他们第一次到达页面时，它只有[]然后当他们专注于该文本框时，光标应该保持在括号之间，并且它们不应该是能够删除括号。

Answer 1

<强>已更新

出于某种原因，我无法在jsFiddle中使用此代码，但我已在以下浏览器中对此代码进行了广泛测试：

Chrome版本30.0.1599.101 m - 工作

FireFox 19 - 工作

FireFox 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>

我希望这适合你。如果有什么我可以帮到你，请告诉我。

感谢。

Answer 2

当您需要在文字字段/电话号码字段

中添加括号时，这是一个快速解决方案

http://ashfaqahmed.net/jquery-add-prefix-postfix-on-phone-number-field/

通过jquery设置文本框内容前缀和后缀并使其不可编辑？

2 个答案: