在 Html 输入值周围放置双引号答案

【问题标题】：Placing Double Quotes Around Html Input Value在 Html 输入值周围放置双引号
【发布时间】：2015-06-23 15:33:00
【问题描述】：

这是我的代码：

<form>
<input class="wrapped-input" type="text" id="blah blah" style="text-align:center" placeholder="(Enter your exact search term here)" name="exact_term" tabindex="5" required/>
</form>

我已经省略了一些东西来使这个表单能够正常工作，但是我想在用户输入到 html 输入字段中的任何值周围加上双引号。

最好的方法是什么？

【问题讨论】：

标签： html forms input quote

【解决方案1】：

您可以在提交表单之前使用 jQuery 来操作字符串，也可以只使用字符串插值在服务器端添加括号。

【讨论】：

【解决方案2】：

我假设您希望将用户提交的内容用引号括起来，而不是操纵文本框本身。

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <link rel="stylesheet" type="text/css" href="style.css">
        <script>
            $(document).ready(function() {
                $('#btnSubmit').click(function() {
                    var userInput = $('#blah-blah').val()
                    alert('User input: "' + userInput + '"');
                });
            });
        </script>
    </head>
    <body>
            <form>
                <input class="wrapped-input" type="text" id="blah-blah" style="text-align:center" placeholder="(Enter your exact search term here)" name="exact_term" tabindex="5" required/>
                <input type="submit" id="btnSubmit" value="Submit" />
            </form>
    </body>
</html>

【讨论】：

【解决方案3】：

这是你想做的纯 JavaScript 版本，因为，嗯，搞砸 jQuery。

var thing = document.getElementById('thing');


thing.addEventListener('keyup', function() {
    if (!/^\"/.test(thing.value)) {
        thing.value = '"' + this.value;
    }
});

thing.addEventListener('blur', function() {
    if (!/\"$/.test(thing.value)) {
        thing.value = this.value + '"';
    }
});

【讨论】：