• appendchild的两个正确用法以及ajax


    <!DOCTYPE HTML>
    <html>
        <head>
            <meta charset="gbk" />
            <title></title>
    
        </head>
        <body>
            <div id="placeholder"></div> 
    
            <script type="text/javascript">
                var placeholder = document.getElementById("placeholder");
                var description = "test";
                placeholder.innerHTML = description;
    
                // 或者
    
                var textNode = document.createTextNode('test123');
                placeholder.appendChild( textNode )
    
    
    
            </script>
        </body>
    </html>

    自己作业中用了一个ajax结果实现的过程中出现了好多的问题:一开始就是上面的append这个方法自己用错了,然后后来发现ajax没有办法加上数据实际上加上数据之后由于是form提交于是又被刷新没了,所以自己需要把form去掉之后再进行提交。

    反正中间出了好多的问题,但是这两个问题应该是最重要的问题了。自己最后慢慢解决后实现成这个样子:

    search<input type="text" name="search" id="inputsearch">
    <button id="btn">search</button>
    <!--    //为什么用onclick=function()不行么我都要哭了-->
    <!--</form>-->
    
    
    
    <script type="text/javascript">
        $(document).ready(function(){
            $("#btn").on("click",function(){
    //            alert($("#inputsearch").val());
                $.ajax({
                    url: 'select.php',
                    type: 'get',
                    dataType: 'json',
                    data: {search: $("#inputsearch").val()},
                    success: function (result) {
    //                alert(result);
                        var json = eval(result);
                        var i = 0;
    //                alert(json[0]['bookid']);
                        for (i; i < json.length; i++) {
    //                    alert(result[0]);
    //                        var app=document.createElement("li");
    //                        app.innerHTML=json[i];
    //                        var father=document.getElementById("con1");
    //                        father.appendChild(app);
                            var app=document.createElement("tr");
                            var  html = "<td>" + json[i]['bookid'] + "</td>" + "<td>" + json[i]['class'] + "</td>" + "<td>" + json[i]['bookname'] + "</td>" + "<td>"+json[i]['press'] + "</td>" +"<td>"+ json[i]['year'] + "</td>" + "<td>" + json[i]['author'] + "</td>" + "<td>" + json[i]['price'] + "</td>" + "<td>" + json[i]['number'] + "</td>" + "<td>" + json[i]['surplus'] + "</td>";
                            var father = document.getElementById("selecttable");
                            app.innerHTML=html;
    //                    alert(html);
                            father.appendChild(app);
    //                        alert(json.length);
                        }
                    }
    
                });
            });
        });
    </script>
  • 相关阅读:
    LibreOJ 6282 数列分块入门 6(在线插入在线查询)
    LibreOJ 6281 数列分块入门 5(分块区间开方区间求和)
    LibreOJ 6280 数列分块入门 4(分块区间加区间求和)
    LibreOJ 6279 数列分块入门 3(分块+排序)
    LibreOJ 6278 数列分块入门 2(分块)
    LibreOJ 6277 数列分块入门 1(分块)
    BZOJ 2301 Problem b(莫比乌斯反演+分块优化)
    MD5Untils加密工具类
    20160418javaweb之 Filter过滤器
    20160417javaweb之servlet监听器
  • 原文地址:https://www.cnblogs.com/zjunet/p/4559913.html
Copyright © 2020-2023  润新知