jquery_ajax 方法的示例

ajax 方法的示例:

前端代码：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script type="text/javascript" src="jquery-3.3.1.js"></script>
    </head>
    <body>
        <h2>Game</h2>
        <h3>猜数字</h3>
        <span>答案是0-100之间的整数</span>
        <input id="content" />
        <button id="btn">guess</button>
        <script>
            $(document).ready(function(){
                $('#btn').click(function(){
                    $.ajax({
                        type:'POST',
                        url:'https://f5e02993c1bd-service.simplelab.cn/ajaxtest',
                        data:{
                            value:$('#content').val(),
                        },
                        dataType:'text',
                        beforeSend:function(xhr){
                            var reg = /^((?!0)\d{1,2}|100)$/;
                            if(!reg.test(parseInt($('#content').val()))){
                                xhr.abort();
                                alert('请输入 0 - 100 的整数');
                            }
                        },
                        success:function(result){
                            alert(result);
                        },
                        error:function(xhr,e){
                            console.log(e);
                        },
                    });
                });
            });
        </script>
    </body>
</html>
后端代码：
//game server
router.post('/ajaxtest',function(req,res,next){
    if(req.body.value == 23)res.send('恭喜你，猜对了');
    else res.send('不是' + req.body.value + '哦，别灰心，再接再厉！');
})

 
posted @ 2021-04-27 15:38  奋斗小青年1  阅读(112)  评论(0)    收藏  举报