1. 程式人生 > >layui中的submit提交本地數據在控制在輸出為空數組(解決)

layui中的submit提交本地數據在控制在輸出為空數組(解決)

cti 屬性 styles lin scrip jquery ctype input lang

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>監聽sublime提交按鈕</title>
    <link rel="stylesheet" href="./layui/css/layui.css">
</head>
<body>
    <form class="layui-form" id="form">
        //添加文本框   name屬性需要加上 可以自己定義
        <input type="text" name="title" class="layui-input">
        <input type="text" name="title" class="layui-input">
        <input type="text" name="title" class="layui-input">
        <button class="layui-btn" lay-submit lay-filter='sign'>提交</button>
    </form>
    <script src="./layui/layui.js"></script>
    <script>
        layui.use(["form",'jquery'],function(){
            var form = layui.form,
                $ = layui.jquery;
            //點擊提交按鈕
            form.on('submit(sign)',function(data){
                console.log(data.elem)
                // console.log(data.form)
                // 能夠獲取到form下input的所有的值 坑 只能得到最後一個文本框中的值
                console.log(data.field)
                // 能夠獲取到form下input的所有的值
                // .serializeArray()返回 JSON 數據結構數據
                console.log($("#form").serializeArray()) //輸出文本框中的值 數組形式
                var form = $("#form").serializeArray()
                for(var i=0;i<form.length;i++){
                    console.log(form[i])
                    console.log(form[i].value)
                }
                return false; //用於頁面跳轉 如果需要跳轉註釋掉就行了
            })
        })
    </script>
</body>
</html>

layui中的submit提交本地數據在控制在輸出為空數組(解決)