码迷,mamicode.com
首页 > Web开发 > 详细

JQUREY 的 表单序列化 和 .$.getScript () 和 $.getJSON() 方法!

时间:2021-06-03 17:35:26      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:nbsp   ajax   单点   button   运动   put   get   javascrip   就是   

传统的表单操作是每个表单元素一个一个获取值进行提交,这样效率比较低

所以我们有了 表单序列化方法: serialize() 他会智能获取表单内的所有元素,会将

里面的内容序列化到字符串中,然后在用AJAX提交。

简单点说:- 方法用于序列化一组表单元素,将表单的内容编码为用于提交的字符串

例:

<body>
    <!-- 此代码已导入JQ !!! 切记!       -->
    
    <form id = "myform">
    昵称<input type="text" name = "username" value="admin">    <br>
    密码<input type="password" name= "passowrd" value = "admin"><br>
    <input type="button" id = "submit" value = "序列化表单【提交】">
    </form>
    
    <script type="text/javascript">
        $(#submit).click(function() {
            alert( $(#myform).serialize() );
        });
    </script>
</body>

打印出来的就是 要提交的内个Get的那个数据: username=admin&passowrd=admin

非常的方便啊,所以我们举一反三:

我们可以在AJAX的data哪里 直接 序列化提交,具体自己去实现啊啊哈哈~~~~

还可以获取单选框 和 复选框 和 下拉框的内容:

<body>
    <!-- 此代码已导入JQ !!! 切记!       -->
    
    <form id = "myform" >
    你喜欢游泳吗?
    <input type="radio" name = "Swimming" value = "喜欢" checked="checked"> 喜欢&nbsp;&nbsp;
    <input type="radio" name = "Swimming" value = "不喜欢"> 不喜欢&nbsp;&nbsp;
    <input type="radio" name = "Swimming" value = "还好"> 还好&nbsp;&nbsp;
        <br>
    你喜欢什么运动?
    <input type="checkbox" name = "hobby1" value = "跑步" > 跑步&nbsp;&nbsp;
    <input type="checkbox" name = "hobby2" value = "跆拳道"> 跆拳道&nbsp;&nbsp;
    <input type="checkbox" name = "hobby3" value = "登高"> 登高&nbsp;&nbsp;
    <input type="checkbox" name = "hobby4" value = "跳绳"> 跳绳&nbsp;&nbsp;
    <input type="checkbox" name = "hobby5" value = "游泳"> 游泳&nbsp;&nbsp;
    <input type="checkbox" name = "hobby6" value = "羽毛球"> 羽毛球&nbsp;&nbsp;
    
    
    <br>
    <input value="序列化提交" id = "submit" type="button">
    </form>
    
    <script type="text/javascript">
        $(#submit).click(function() {
            console.log($(#myform).serialize())
        });
    </script>
</body>

我选了几个啊 返回的是:Swimming=%E5%96%9C%E6%AC%A2&hobby1=%E8%B7%91%E6%AD%A5&hobby4=%E8%B7%B3%E7%BB%B3&hobby6=%E7%BE%BD%E6%AF%9B%E7%90%83

然后我们将其解码:Swimming=喜欢&hobby1=跑步&hobby4=跳绳&hobby6=羽毛球

也可以用decodeURIComponent()解码...你自己喜欢啦...

 

JQUREY 的 表单序列化 和 .$.getScript () 和 $.getJSON() 方法!

标签:nbsp   ajax   单点   button   运动   put   get   javascrip   就是   

原文地址:https://www.cnblogs.com/bi-hu/p/14843102.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!