nodejs express 响应按钮事件，不使用router
发布于 1年前 作者 sihao1234 1098 次浏览

在某一个页面。填写了一些输入框。然后点击一个button做一些数据库操作。但是我想处理完之后页面不刷新，也就是之前输入的信息保持不变。 这个需要重新routes吗？还是在app.js里除了get, set, post之外有其他的方法呢。

举例说明：

需求：

在页面上点击 按钮 数据库进行初始化

使用routes路由，以便能够在服务器端执行数据库操作的 代码：

服务器端： 
app.js
app.get('/initializing', routes.initialize); 

index.js
exports.initialize = function(req, res){
        console.log('initializing');
        //写业务代码，进行数据库初始化
        // ...成功
        // 重定向到原页面
        res.redirect("/") ; // 地址重写
};

除此之外，还需要在服务器上新建initializing.html空白页面。否则404 且，这样的方法返回后就重新刷新了原页面。原页面上所填的信息就丢失了。

客户端：
index.ejs
<input type="text" id="myIndexText"/>
...
<a id="initializing" href="/initializing" >数据初始化</a>

问题：

必须用此方法routes下实现吗？
还是在app.js里除了get, set, post之外有其他的方法呢。
或者ajax或者其他的方法呢？
我不知道该怎么写，求测试代码。
谢谢！！！
8 回复

ajax

能否明示？ 哪里有实例可以参考下的呢？

主要是服务器端不知道该怎么写。。

页面上除了 get, set, post 还怎么让服务器端执行function呢？

你的请求肯定有一个返回的response，你返回json就是了撒，然后怎么处理看你自己情况，也可以不管他，页面就不会刷新，这种要求嘛，强力推荐angularJs。。你懂的。方便快捷省时又省心

使用ajax，就是写个function(result){…}。
在models中进行数据的操作。如果修改成功，就callback(1),否则callback(0).在客户端请求的代码中对返回值进行判断.得到的是1就维持现状，0则清空并且提示！

###注意：刚刚写的只是实现的思路。具体的业务还要补充一些。

不是让服务器执行fn，而是有请求进服务器了，才响应该请求，去执行该执行的fn。 ajax请求也一样，和普通的网页请求类似，只不过它是异步的而已。

好的，谢谢大家！

下面是我写的一个例子。主要是之前不知道服务器端有： res.send(“来自服务器的响应”); }

res对象还有其他什么方法嘞？

服务器端

                app.js

                   app.get('/initializing2', routes.initialize2);


                index.js

                    exports.initialize2 = function(req, res){
   console.log('initializing2'); 
   res.send("来自服务器的响应"); }

客户端

                     <h2>AJAX</h2>
                    <button type="button" onclick="loadXMLDoc()">请求数据</button>
                    <div id="myDiv"></div>

                    <script>
                        //AJAX
                        function loadXMLDoc()
                        {
                            var xmlhttp;
                            var str;
                            if (window.XMLHttpRequest)
                            {// code for IE7+, Firefox, Chrome, Opera, Safari
                                xmlhttp=new XMLHttpRequest();
                            }
                            else
                            {// code for IE6, IE5
                                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                            }
                            xmlhttp.onreadystatechange=function()
                            {
                                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                                {
                                    str = xmlhttp.responseText;//得到服务器响应
                                    document.getElementById("myDiv").innerHTML=str;
                                }
                            }

                            xmlhttp.open("GET","/initializing2",true);
                            xmlhttp.send();
                        }
                    </script>

a o , 格式不太好。。。

回到顶部