jquery - 清除移动网站表单字段元素上的默认文本

Question

好的，我正在使用 jQuery Mobile framework我希望能够使用文本或文本区域中的默认值作为辅助文本。但在焦点上清除文本并保留新输入的值。还要重新聚焦(假设他们再次错误地触摸它)，不要再次清除该值。

我包括这些

<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>

该示例不起作用

将其添加到页面本身:( link to example )

<script type="text/javascript">
    $('.default-value').each(function() {
        var default_value = this.value;
        $(this).focus(function() {
            if(this.value == default_value) {
                this.value = '';
            }
        });
        $(this).blur(function() {
            if(this.value == '') {
                this.value = default_value;
            }
        });
    });
</script>

这是 HTML(它也在表单标签中)

<!-- Address 2 -->
<div data-role="fieldcontain">
    <label for="address-2">Address 2</label>
    <input type="text" name="address-2" id="address-2" class="default-value" value="Apt #, Suite #, Floor #"  />
</div>

Answer 1

对于后代:HTML5 中有一种叫做占位符的东西

<input type="text" name="address-2" placeholder="Apt #, Suite #, Floor #"  />

占位符目前在最新的基于 webkit 的浏览器中受支持。