jquery 获取表单的内容以JSON对象形式返回

最新推荐文章于 2024-05-26 10:20:15 发布

weixin_30456039

最新推荐文章于 2024-05-26 10:20:15 发布

阅读量75

点赞数

文章标签： json javascript ViewUI

原文链接：http://www.cnblogs.com/bldf/p/6697753.html

版权

添加一个serializeJson方法

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <style>
    div {
      margin: 10px;
    }
  </style>
</head>
<body>
  <form id="form">
    <div>username: <input type="" name="user" value=""></div>
    <div>email: <input type="text" name="email" value=""></div>
    <div>
      introdution: <textarea rows="10" cols="30" name="intro"></textarea>
    </div>
  </form>
  <div><input type="button" value="get data" id="btn"></div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script>
    (function ($) {
      $.fn.serializeJson = function () {
          var serializeObj = {};
          $(this.serializeArray()).each(function () {
              serializeObj[this.name] = this.value;
          });
          return serializeObj;
      };
      $('#btn').click(function () {
        var data = $('#form').serializeJson();// 调用serializeJson方法获取表单内容
        console.log(data);
      })
    })(jQuery);
    
  </script>
</body>
</html>

转载于:https://www.cnblogs.com/bldf/p/6697753.html

优惠劵

weixin_30456039

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery 获取表单的内容以JSON对象形式返回

添加一个serializeJson方法<!DOCTYPE html><html><head> <meta charset="UTF-8"> <style> div { margin: 10px; } </style></head><b...
复制链接

扫一扫