给input域一个默认值，然后在聚焦的时候清空它 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Expires" content="Fri, Jan 01 1900 00:00:00 GMT">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Lang" content="en">
<meta name="author" content="">
<meta http-equiv="Reply-to" content="@.com">
<meta name="generator" content="PhpED 5.6">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="creation-date" content="11/11/2008">
<meta name="revisit-after" content="15 days">
<title>Untitled</title>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"
type="text/javascript"></script>
</head>
<body>

<form id="testform">
    <input class="clear" type="text" value="Always cleared" />
    <input class="clear once" type="text" value="Cleared only once" />
    <input type="text" value="Normal text" />
</form>

<script type="text/javascript">
jQuery.fn.log = function (msg) {
console.log("%s: %o", msg, this);
return this;
};
  
$(function() {
    //Go through every input field with clear class using each function
    //(NB! "clear once" is two classes clear and once)
    $('#testform input.clear').each(function(){
        //use the data function to save the data
        $(this).data( "txt", $.trim($(this).val()) );
    }).focus(function(){
        // On focus test for default saved value and if not the same clear it
        if ( $.trim($(this).val()) === $(this).data("txt") ) {
            $(this).val("");
        }
    }).blur(function(){
        // Use blur event to reset default value in field that have class clear
        // but ignore if class once is present
        if ( $.trim($(this).val()) === "" && !$(this).hasClass("once") ) {
            //Restore saved data
            $(this).val( $(this).data("txt") );
        }
    });
});  



var input_text = $('#shopping_cart_items input.text');
input_text
    .css('border', '3px dashed yellow')
    .css('background-color', 'red')
    .val("text updated");  
</script>

</body>
</html>

　demo下载地址：https://files.cnblogs.com/ishibin/js_input%E8%AE%BE%E7%BD%AE%E9%BB%98%E8%AE%A4%E5%80%BC.rar

posted @ 2013-01-04 23:03  ishibin  阅读(352)  评论(0)  编辑  收藏  举报