(function($) {
$.fn.setTip = function(options) {
var defaults = {
defaultValue: "",
focusColor: "#000000",
blurColor: "#ccc",
fontSize: "10pt"
}
var options = $.extend(defaults, options);
this.each(function() {
var thisSearch = $(this);
thisSearch.focus(function() {
if (thisSearch.val() == options.defaultValue) {
thisSearch.css("color", options.focusColor);
thisSearch.val("");
}
}).blur(function() {
if ( thisSearch.val() === undefined || thisSearch.val() == '') {
thisSearch.css("color", options.blurColor);
thisSearch.val(options.defaultValue);
}
}).css({ "color": options.blurColor, "font-size": options.fontSize });
if (thisSearch.val() == 'undefined' || thisSearch.val() == "") {
thisSearch.val(options.defaultValue);
} else if (thisSearch.val() != options.defaultValue) {
thisSearch.css("color", options.focusColor);
}
});
};
})(jQuery);
用来生成输入框默认显示内容,没有输入不同内容时就默认显示其内容:
<script type="text/javascript" src="jQuery.setTip.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#newInput").setTip({defaultValue:"世界,你好!"});
});
</script>
</head>
<body>
<input type="text" id="newInput" >
</body>