458day（val方法）

最新推荐文章于 2025-08-12 02:03:30 发布

原创最新推荐文章于 2025-08-12 02:03:30 发布 · 143 阅读

0 ·

CC 4.0 BY-SA版权

本文通过实例演示了jQuery中val()方法的使用技巧，详细解释了如何利用val()方法读取和设置表单元素的值，同时展示了如何结合事件监听器实现输入框默认值的动态显示与清除功能。

《2019年1月5日》【连续458天】

标题：val方法；

内容：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<input type="button" value="呵呵" id="btn">
<input type="text" value="haha" id="txt">


<script src="jquery-1.12.4.js"></script>
<script>
  $(function () {
    //console.log($("#btn").val());
    //$("#btn").val("哈哈");
    //console.log($("#btn").attr("value"));
    
    //$("#txt").val("123");
    
    
    $("#txt").focus(function () {
      //如果是默认值，清空内容
      if($(this).val() === "haha"){
        $(this).val("");
      }
    });
  
    $("#txt").blur(function () {
      if($(this).val() === ""){
        $(this).val("haha");
      }
    });
    
    
  });
</script>
</body>
</html>