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

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

所以我们有了 表单序列化方法: 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()解码...你自己喜欢啦...


 getScript() 方法

getScript() 方法通过 HTTP GET 请求载入并执行 JavaScript 文件。

语法

jQuery.getScript(url,success(response,status))
参数描述
url 将要请求的 URL 字符串。
success(response,status)

可选。规定请求成功后执行的回调函数。

额外的参数:

  • response - 包含来自请求的结果数据
  • status - 包含请求的状态("success", "notmodified", "error", "timeout" 或 "parsererror")

该函数是简写的 Ajax 函数,等价于:

$.ajax({
  url: url,
  dataType: "script",
  success: success
});

注释:jQuery 1.2 版本之前,getScript 只能调用同域 JS 文件1.2中,您可以跨域调用 JavaScript 文件。注意:Safari 2 或更早的版本不能在全局作用域中同步执行脚本。如果通过 getScript 加入脚本,请加入延时函数。

其实没什么用.........

例子 1

加载并执行 test.js:

$.getScript("test.js");


他那两个参数 你自己加 ,,一个是返回的结果 一个是请求的状态


getJSON() 方法

getJSON() 方法使用 AJAX 的 HTTP GET 请求获取 JSON 数据。

 

 

 

语法

$(selector).getJSON(url,data,success(data,status,xhr))

 

参数描述
url 必需。规定将请求发送到哪个 URL。
data 可选。规定发送到服务器的数据。
success(data,status,xhr) 可选。规定当请求成功时运行的函数。
额外的参数:
  • data - 包含从服务器返回的数据
  • status - 包含请求的状态("success"、"notmodified"、"error"、"timeout"、"parsererror")
  • xhr - 包含 XMLHttpRequest 对象

这个url可以是一个文件 .json文件  主要还是success这个方法 返回的东西我们可以运用

这都不怎么用 JQ 也要被淘汰了  学吧 就算倒闭了我也要学 哎

本文来自博客园,作者:咸瑜,转载请注明原文链接:https://www.cnblogs.com/bi-hu/p/14843102.html

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