JS case study record

Take the project as an example, on the code

一、 $(document).ready()

    Execute after loading the document structure (not including non-text media files such as pictures)

 $(document).ready(function(){
        $('#a').function();
    });

Second, the meaning of $(#'a')

  $("#a").val(), means there is a text box with id="a", $("#a").val() is to get the content of the text box, which is
equivalent to document.getElementById ("a").val()

var a = $("#a").val();

三、document.forms[0]

 forms returns a collection (an HTMLCollection object) that contains all the form elements in the current document.
1.document.forms: Get all the forms on the current page.
2.document.fornms[0]: Get the first form of the current page.
3.submit() submits the form.

if (beginDate == "com"){
    document.forms[0].action = "a.cmd";
}
document.forms[0].submit();

Four, alert()

alert(): Display an alert box with a specified message and an OK button.
Written in the script tag.
The content in parentheses is a string or integer.
Click to confirm to close, no return value

function f(de) {
        if ("0" == de) {
            alert('该客户没有订单!');
        } else {
            ***
            }
            document.forms[0].action = "c=" + de+"&sw";
            document.forms[0].submit();
        }
    }

五、parent()、find()、encodeURI()、serialize() 

        The parent() method returns the direct parent element of the selected element.

var tr=$(inpt).parent().parent();

        The find() method returns the value of the first element of the array that passed the test (judged in the function). Find here implements the value of name=a in input  

var a_Id = tr.find("input[name*='a']").val();

        The encodeURI() function can encode a string as a URI.

var url = encodeURI(encodeURI("url1 +"&ac="+ac));

        The serialization function, serialize().serialize()
        method creates a text string represented by standard URL encoding. Its operating object is a jQuery object representing a collection of form elements.
        The serialized value can be used in the URL query string when generating an AJAX request.

 var form = $("#myForm").serialize();

        Extension: The document node element operation analysis summarized by a great god

https://blog.csdn.net/xiangxiangw29/article/details/52460563?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4.nonecase&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4.nonecase 

 Six, ajax analysis

$.ajax({
   
   

          Send address of current request

url:url,

           The default setting is true, and all requests are asynchronous requests. If you need to send a synchronization request, set this option to false. Note that the synchronization request will lock the browser, and other user operations must wait for the request to complete before they can be executed.

 async: false,

            Requires a String type parameter, and expects the data type returned by the server. If not specified, JQuery will automatically return responseXML or responseText according to the http package mime information, and pass it as a callback function parameter. The available types are as follows:
             xml: returns an XML document, which can be processed by JQuery.
             html: Returns the plain text HTML information; the included script tag will be executed when inserted into the DOM.
             script: Returns the plain text JavaScript code. The results are not automatically cached. Unless the cache parameter is set. Note that when requesting remotely (not under the same domain), all post requests will be converted to get requests.
             json: Return JSON data.
             jsonp: JSONP format. When using SONP to call a function, such as myurl?callback=?, JQuery will automatically replace the last "?" with the correct function name to execute the callback function.
             text: returns a plain text string.

dataType: "text",


            The required parameters are of type Function. The callback function called after the request is successful has two parameters.
            (1) The data returned by the server and processed according to the dataType parameter.
            (2) A character string describing the state.
            data can be xmlDoc, jsonObj, html, text, etc.
            , the options parameter passed when calling this ajax request  

success: function (data, status) {
                if (status == "success") {
   
   

           It is equivalent to document.getElementById("a").innerHTML="1";

           element method manual

           https://www.w3school.com.cn/jsref/dom_obj_all.asp

$('#a').html("1");

           Set "Impossibility" to false in
           three ways to remove disabled attributes
           $('#a').attr("disabled",false);
           $('#a').removeAttr("disabled");
           $('# a').attr("disabled","");

$("#a").attr("disabled", false);
                } else {
                    jError("加载失败!");
                }
                //layer,web弹层组件
                layer.close(myLayer);
            },
            error: function () {
                jError("加载异常!");
                layer.close(myLayer);
            }
        });
  • Attached, full version code 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@page import="javax.swing.text.Document"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
         pageEncoding="utf-8"%>
<%@ page import="java.util.*"%>
<%
    String a=request.getParameter("a");
    String b=request.getParameter("b");
%>

<website:title>js与html学习汇总</website:title>

<script type="text/javascript">


    //加载文档结构后(不包含图片等非文字媒体文件)执行
    $(document).ready(function(){
        $('#a').function();
    });

    function b() {


        //$("#a").val(),表示有一个id="a"的文本框,$("#a").val() 是获得该文本框里面制的内容
        //下面等同于document.getElementById("a")
        var a = $("#a").val();
        if (beginDate == "com"){
        // forms 返回一个集合 (一个HTMLCollection对象),包含了了当前文档中的所有form元素.
        // 1.document.forms:获取当前页面所有表单。
        // 2.document.fornms[0]:获取当前页面第一个表单。
        // 3.submit()提交表单。
            document.forms[0].action = "a.cmd";
        }
        document.forms[0].submit();
    }


    function f(de) {
        if ("0" == de) {


            // alert():显示带有一条指定消息和一个 OK(确认) 按钮的警告框。
            // 写在script标签中
            // 括号中的内容为字符串或者整型
            // 点击确认即可关闭,无返回值
            alert('该客户没有订单!');
        } else {
            ***
            }
            document.forms[0].action = "c=" + de+"&sw";
            document.forms[0].submit();
        }
    }
    function getBalance(inpt) {

        //parent() 方法返回被选元素的直接父元素。
        var tr=$(inpt).parent().parent();

        //find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。这里的find实现input中 
        name=a 的值
        var a_Id = tr.find("input[name*='a']").val();

        //encodeURI() 函数可把字符串作为 URI 进行编码。
        var url = encodeURI(encodeURI("url1 +"&ac="+ac
        ));

        //序列化函数,serialize(),
        // .serialize() 方法创建以标准 URL 编码表示的文本字符串。它的操作对象是代表表单元素集合的 jQuery 对象。
        //序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。
        var form = $("#myForm").serialize();
        var myLayer = layer.load("正在加载...");

        $.ajax({
            //当前请求的发送地址
            url:url,
            //默认设置为true,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为false。注意,同步请求将锁住浏览器,用户其他操作必须等待请求完成才可以执行。
            async: false,
            //要求为String类型的参数,预期服务器返回的数据类型。如果不指定,JQuery将自动根据http包mime信息返回responseXML或responseText,并作为回调函数参数传递。可用的类型如下:
            // xml:返回XML文档,可用JQuery处理。
            // html:返回纯文本HTML信息;包含的script标签会在插入DOM时执行。
            // script:返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时(不在同一个域下),所有post请求都将转为get请求。
            // json:返回JSON数据。
            // jsonp:JSONP格式。使用SONP形式调用函数时,例如myurl?callback=?,JQuery将自动替换后一个“?”为正确的函数名,以执行回调函数。
            // text:返回纯文本字符串。

            dataType: "text",
            // 要求为Function类型的参数,请求成功后调用的回调函数,有两个参数。
            // (1)由服务器返回,并根据dataType参数进行处理后的数据。
            // (2)描述状态的字符串。
            //data可以是xmlDoc、jsonObj、html、text等等
            //status调用本次ajax请求时传递的options参数
            success: function (data, status) {
                if (status == "success") {
                    //相当于基本语法的document.getElementById("a").innerHTML="1";
                    $('#a').html("1");
                    //设置"不可度"为false
                    //三种方法移除disabled属性
                    // $('#a').attr("disabled",false);
                    // $('#a').removeAttr("disabled");
                    // $('#a').attr("disabled","");
                    $("#a").attr("disabled", false);
                } else {
                    jError("加载失败!");
                }
                //layer,web弹层组件
                layer.close(myLayer);
            },
            error: function () {
                jError("加载异常!");
                layer.close(myLayer);
            }
        });
    }
</script>
    

 

Guess you like

Origin blog.csdn.net/qq_36766417/article/details/106266498