Question

我有以下代码，以便当用户选择一个输入框时，该值将消失，但是一旦用户点击它，就会重新插入默认值。

        $(function() {
            var defaultText = '';
            $('input[id=input]').focus(function() {
                defaultText = $(this).val();
                $(this).val('');
            });
            $('input[id=input]').blur(function() {
                $(this).val(defaultText); 
             });
         });

然而，这并不是我想要的。如果用户插入文本，我不希望默认文本覆盖用户放置的内容。我也是jQuery的新手，所以任何帮助都会非常感激。

Answer 1

在focus()方法中，您应该在清除之前检查它是否等于defaultText，在blur()函数中，您只需要检查val()是否defaultText在设置input.input之前为空。如果您打算使用多个输入，最好使用类而不是ID，因此当类是“输入”时，您的选择器将为input#input。即使它是ID，您也可以将其引用为// run when DOM is ready() $(document).ready(function() { $('input.input').on('focus', function() { // On first focus, check to see if we have the default text saved // If not, save current value to data() if (!$(this).data('defaultText')) $(this).data('defaultText', $(this).val()); // check to see if the input currently equals the default before clearing it if ($(this).val()==$(this).data('defaultText')) $(this).val(''); }); $('input.input').on('blur', function() { // on blur, if there is no value, set the defaultText if ($(this).val()=='') $(this).val($(this).data('defaultText')); }); });。

{{1}}

在this jsFiddle中设置它。

Answer 2

在你的模糊处理程序中，只检查用户是否没有写任何东西，在这种情况下放回默认文本，如下所示：

         $('input[id=input]').blur(function() {
            if ($(this).val() == '') {
                $(this).val(defaultText); 
            }
         });

Answer 3

一个老问题+我不喜欢它，当人们提供另一个解决方案而不是解决我的问题时，尽管如此：使用带有jQuery插件的HTML占位符属性可以解决问题。

您还可以使用HTML数据属性并从中进行写入/读取。

jQuery输入值焦点和模糊

3 个答案: