Question

＆＃13;

<script type="text/javascript">
jQuery(function() {
var default_val = "Name";
jQuery("input[name='first_name']").val(default_val)
.focus(function() {
if (jQuery(Name).val() == default_val) {
jQuery(this).val("")
}
});
var default_val = "Email Address";
jQuery("input[name='email']").val(default_val)
.focus(function() {
if (jQuery(this).val() == default_val) {
jQuery(this).val("")
}
});
var default_val = "Practice Name";
jQuery("input[name='practice_name']").val(default_val)
.focus(function() {
if (jQuery(this).val() == default_val) {
jQuery(this).val("")
}
});
var default_val = "Practice Website URL";
jQuery("input[name='practice_url']").val(default_val)
.focus(function() {
if (jQuery(this).val() == default_val) {
jQuery(this).val("")
}
});
var default_val = "Telephone";
jQuery("input[name='phone_number']").val(default_val)
.focus(function() {
if (jQuery(this).val() == default_val) {
jQuery(this).val("")
}
});
});

</script>

＆＃13;

Answer 1

您可以使用不同的变量为每个输入设置默认值，以避免覆盖该值。例如：

<强> HTML：

<input name="practice_url" value="" />
<input name="phone_number" value="" />

<强> JS：

jQuery(function() { 
var default_val_practice_url = "Practice Website URL";
jQuery("input[name='practice_url']").val(default_val_practice_url)
.focus(function() {
if (jQuery(this).val() == default_val_practice_url) {
jQuery(this).val("")
}
});
var default_val = "Telephone";
jQuery("input[name='phone_number']").val(default_val)
.focus(function() {
if (jQuery(this).val() == default_val) {
jQuery(this).val("")
}
});
});

JS小提琴： http://jsfiddle.net/22mo0mL3/ 顺便说一下，你可以使用jquery-placeholder库。它也很酷！（https://github.com/mathiasbynens/jquery-placeholder）

Answer 2

您正在使用default_val。而不是使用它，使用有意义的变量名称，如deafult_name，default_email，default_url等。此外，最好将这些静态变量放在顶部。代码

Answer 3

注意：您应该考虑使用placeholder attribute代替。

您正在使用传递给default_val方法的回调函数中的.focus()变量。调用回调时该变量的值不是调用.focus()方法时的值。

您可以将重复的代码移动到一个函数中：

jQuery(function($) {
    function setDefaultValue($input, defaultValue) {
        $input.val(defaultValue).focus(function() {
            var $input = $(this);
            if ($input.val() == defaultValue) {
                $input.val("");
            }
        });  
    }

    setDefaultValue($("input[name='first_name']"), "Name");
    setDefaultValue($("input[name='email']"), "Email Address");
    setDefaultValue($("input[name='practice_name']"), "Practice Name");
    setDefaultValue($("input[name='practice_url']"), "Practice Website URL");
    setDefaultValue($("input[name='phone_number']"), "Telephone");
});

注意：

jQuery对象作为参数传递给传递给jQuery()函数的回调函数。上面的代码使用了这个事实，因此可以使用jQuery安全地引用$对象。
在传递给焦点方法的回调函数中，this指的是调用.focus()的元素。

除了最后一个之外，无法使FOCUS功能起作用

3 个答案: