请稍等 ...
×

采纳答案成功！

向帮助你的同学说点啥吧！感谢那些助人为乐的人

点击提交按钮后，页面无响应

传入shopId,可以从数据库获取对应的信息，修改完成后，点击提交，页面无响应，数据库后台无响应,控制台没有报错信息。
在submit.click 里面设置断点进行debug，跳不进去。
在后端modifyShop设置断点，也跳不进去。
可以getshopbyid。
求老师解答
![图片描述](htt://img1.sycdn.imooc.com//szimg/5d9ac1730952c3![![![![图片描述
图片描述
图片描述
图片描述
图片描述
weixin_宝慕林61219 2019-10-07 12:43:03
源自：6-4  店铺信息编辑之前端实现
1183
收起

正在回答 回答被采纳积分+3

插入代码

提交 取消

6回答

慕哥1583910 2019-11-20 22:16:47

老哥，我也出现了和你一样的问题，我添加商铺的时候提交按钮可以响应，一到修改点提交就没响应，怎么样，你的解决了吗？

1 回复 有任何疑惑可以回复我~
收起回答
  • 翔仔 #1 
    同学好，可以看看chrome控制台有没有报错，也可以尝试在ajax方法里面添加error方法https://www.cnblogs.com/feixiablog/p/8809925.html
    回复 有任何疑惑可以回复我~ 2019-11-21 01:36:08
  • 慕哥1583910 回复 翔仔 #2 
    老师好，首先感谢你的回复，我加了，也用了alert，清理缓存都试过了，还是不行，idea和浏览器点提交都没有报错，就是没响应，在submit打断点代码都不执行，事件触发不了，当我换成注册的url时候，又可以触发事件，真奇怪，换成修改的就又不行了。
    回复 有任何疑惑可以回复我~ 2019-11-21 19:54:42
  • 翔仔 回复 慕哥1583910 #3 
    同学好，可以按照我上面说的在ajax方法里添加和success方法同级的error试试？此外，如果是submit里面第一行就不执行的话，看看是不是方法和你提交按钮没有对应起来？
    回复 有任何疑惑可以回复我~ 2019-11-22 00:34:09
点开查看后面1条评论
取消 回复
百香果女孩 2020-01-07 20:26:27

同学你的问题解决了没，我也遇到了和你一样的问题

0 回复 有任何疑惑可以回复我~
收起回答
  • weixin_慕神5542715 #1 
    你可能把click事件写下getShopInitInfo方法里了
    回复 有任何疑惑可以回复我~ 2020-02-05 16:01:19
取消 回复
翔仔 2019-10-11 00:29:03

同学要不直接复制粘贴我的，没问题后，再对比下看看差别在哪里：）

感谢同学的关心，没办法 加班比较多，比较忙，回来就11点多了，一般都会回答问题和备课到深夜

shopoperation.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
/**
 * 
 */
$(function() {
    // 从URL里获取shopId参数的值
    var shopId = getQueryString('shopId');
    // 由于店铺注册和编辑使用的是同一个页面，
    // 该标识符用来标明本次是添加还是编辑操作
    var isEdit = shopId ? true : false;
    // 用于店铺注册时候的店铺类别以及区域列表的初始化的URL
    var initUrl = '/o2o/shopadmin/getshopinitinfo';
    // 注册店铺的URL
    var registerShopUrl = '/o2o/shopadmin/registershop';
    // 编辑店铺前需要获取店铺信息，这里为获取当前店铺信息的URL
    var shopInfoUrl = "/o2o/shopadmin/getshopbyid?shopId=" + shopId;
    // 编辑店铺信息的URL
    var editShopUrl = '/o2o/shopadmin/modifyshop';
    // 判断是编辑操作还是注册操作
    if (!isEdit) {
        getShopInitInfo();
    } else {
        getShopInfo(shopId);
    }
    // 通过店铺Id获取店铺信息
    function getShopInfo(shopId) {
        $.getJSON(shopInfoUrl, function(data) {
            if (data.success) {
                // 若访问成功，则依据后台传递过来的店铺信息为表单元素赋值
                var shop = data.shop;
                $('#shop-name').val(shop.shopName);
                $('#shop-addr').val(shop.shopAddr);
                $('#shop-phone').val(shop.phone);
                $('#shop-desc').val(shop.shopDesc);
                // 给店铺类别选定原先的店铺类别值
                var shopCategory = '<option data-id="'
                        + shop.shopCategory.shopCategoryId + '" selected>'
                        + shop.shopCategory.shopCategoryName + '</option>';
                var tempAreaHtml = '';
                // 初始化区域列表
                data.areaList.map(function(item, index) {
                    tempAreaHtml += '<option data-id="' + item.areaId + '">'
                            + item.areaName + '</option>';
                });
                $('#shop-category').html(shopCategory);
                // 不允许选择店铺类别
                $('#shop-category').attr('disabled', 'disabled');
                $('#area').html(tempAreaHtml);
                // 给店铺选定原先的所属的区域
                $("#area option[data-id='" + shop.area.areaId + "']").attr(
                        "selected", "selected");
            }
        });
    }
    // 取得所有二级店铺类别以及区域信息，并分别赋值进类别列表以及区域列表
    function getShopInitInfo() {
        $.getJSON(initUrl, function(data) {
            if (data.success) {
                var tempHtml = '';
                var tempAreaHtml = '';
                data.shopCategoryList.map(function(item, index) {
                    tempHtml += '<option data-id="' + item.shopCategoryId
                            + '">' + item.shopCategoryName + '</option>';
                });
                data.areaList.map(function(item, index) {
                    tempAreaHtml += '<option data-id="' + item.areaId + '">'
                            + item.areaName + '</option>';
                });
                $('#shop-category').html(tempHtml);
                $('#area').html(tempAreaHtml);
            }
        });
    }
    // 提交按钮的事件响应，分别对店铺注册和编辑操作做不同响应
    $('#submit').click(function() {
        // 创建shop对象
        var shop = {};
        if (isEdit) {
            // 若属于编辑，则给shopId赋值
            shop.shopId = shopId;
        }
        // 获取表单里的数据并填充进对应的店铺属性中
        shop.shopName = $('#shop-name').val();
        shop.shopAddr = $('#shop-addr').val();
        shop.phone = $('#shop-phone').val();
        shop.shopDesc = $('#shop-desc').val();
        // 选择选定好的店铺类别
        shop.shopCategory = {
            shopCategoryId : $('#shop-category').find('option').not(function() {
                return !this.selected;
            }).data('id')
        };
        // 选择选定好的区域信息
        shop.area = {
            areaId : $('#area').find('option').not(function() {
                return !this.selected;
            }).data('id')
        };
        // 获取上传的图片文件流
        var shopImg = $('#shop-img')[0].files[0];
        // 生成表单对象，用于接收参数并传递给后台
        var formData = new FormData();
        // 添加图片流进表单对象里
        formData.append('shopImg', shopImg);
        // 将shop json对象转成字符流保存至表单对象key为shopStr的的键值对里
        formData.append('shopStr', JSON.stringify(shop));
        // 获取表单里输入的验证码
        var verifyCodeActual = $('#j_captcha').val();
        if (!verifyCodeActual) {
            $.toast('请输入验证码！');
            return;
        }
        formData.append('verifyCodeActual', verifyCodeActual);
        // 将数据提交至后台处理相关操作
        $.ajax({
            url : (isEdit ? editShopUrl : registerShopUrl),
            type : 'POST',
            data : formData,
            contentType : false,
            processData : false,
            cache : false,
            success : function(data) {
                if (data.success) {
                    $.toast('提交成功！');
                    if (!isEdit) {
                        // 若为注册操作，成功后返回店铺列表页
                        window.location.href = "/o2o/shopadmin/shoplist";
                    }
                } else {
                    $.toast('提交失败！' + data.errMsg);
                }
                // 点击验证码图片的时候，注册码会改变
                $('#captcha_img').click();
            }
        });
    });
 
})

shopoperation.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>SUI Mobile Demo</title>
<meta name="description"
    content="MSUI: Build mobile apps with simple HTML, CSS, and JS components.">
<meta name="author" content="阿里巴巴国际UED前端">
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<link rel="shortcut icon" href="/favicon.ico">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
 
<!-- Google Web Fonts -->
 
<link rel="stylesheet"
    href="//g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">
<link rel="stylesheet"
    href="//g.alicdn.com/msui/sm/0.6.2/css/sm-extend.min.css">
 
<link rel="apple-touch-icon-precomposed"
    href="/assets/img/apple-touch-icon-114x114.png">
 
</head>
<body>
    <div class="page-group">
        <div id="page-label-input" class="page">
            <header class="bar bar-nav">
                <a class="button button-link button-nav pull-left back"
                    href="/demos/form"> <span class="icon icon-left"></span> 返回
                </a>
                <h1 class="title">商店信息</h1>
            </header>
            <div class="content">
                <div class="list-block">
                    <ul>
                        <!-- Text inputs -->
                        <li>
                            <div class="item-content">
                                <div class="item-inner">
                                    <div class="item-title label">商铺名称</div>
                                    <div class="item-input">
                                        <input type="text" id="shop-name" placeholder="商铺名称">
                                    </div>
                                </div>
                            </div>
                        </li>
                        <!-- 商铺分类 下拉列表 -->
                        <li>
                            <div class="item-content">
                                <div class="item-inner">
                                    <div class="item-title label">商铺分类</div>
                                    <div class="item-input">
                                        <select id="shop-category">
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <!-- 区域分类 下拉列表 -->
                        <li>
                            <div class="item-content">
                                <div class="item-inner">
                                    <div class="item-title label">所属区域</div>
                                    <div class="item-input">
                                        <select id="area">
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <!-- 详细地址 text -->
                        <li>
                            <div class="item-content">
                                <div class="item-inner">
                                    <div class="item-title label">详细地址</div>
                                    <div class="item-input">
                                        <input type="text" id="shop-addr" placeholder="详细地址">
                                    </div>
                                </div>
                            </div>
                        </li>
                        <!-- 联系电话 text -->
                        <li>
                            <div class="item-content">
                                <div class="item-inner">
                                    <div class="item-title label">联系电话</div>
                                    <div class="item-input">
                                        <input type="text" id="shop-phone" placeholder="联系电话">
                                    </div>
                                </div>
                            </div>
                        </li>
                        <!-- 缩略图 上传控件 -->
                        <li>
                            <div class="item-content">
                                <div class="item-inner">
                                    <div class="item-title label">缩略图</div>
                                    <div class="item-input">
                                        <input type="file" id="shop-img">
                                    </div>
                                </div>
                            </div>
                        </li>
                        <!-- 店铺简介 textarea -->
                        <li class="align-top">
                            <div class="item-content">
                                <div class="item-inner">
                                    <div class="item-title label">店铺简介</div>
                                    <div class="item-input">
                                        <textarea id="shop-desc" placeholder="店铺简介"></textarea>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <!-- 验证码 ka -->
                        <li>
                            <div class="item-content">
                                <div class="item-inner">
                                    <div class="item-title label">验证码</div>
                                    <input type="text" id="j_captcha" placeholder="验证码">
                                    <div class="item-input">
                                        <img id="captcha_img" alt="点击更换" title="点击更换"
                                            onclick="changeVerifyCode(this)" src="../Kaptcha" />
                                    </div>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="content-block">
                    <div class="row">
                        <div class="col-50">
                            <a href="/o2o/shopadmin/shopmanagement" class="button button-big button-fill button-danger">返回</a>
                        </div>
                        <div class="col-50">
                            <a href="#" class="button button-big button-fill button-success"
                                id="submit">提交</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
 
    </div>
    <script type='text/javascript'
        src='//g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
    <script type='text/javascript'
        src='//g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>
    <script type='text/javascript'
        src='//g.alicdn.com/msui/sm/0.6.2/js/sm-extend.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='../resources/js/common/common.js'
        charset='utf-8'></script>
    <script type='text/javascript'
        src='../resources/js/shop/shopoperation.js' charset='utf-8'></script>
</body>
</html>

修改后，务必记得清空页面缓存，让js生效后再试试：）

0 回复 有任何疑惑可以回复我~
收起回答
取消 回复
提问者 weixin_宝慕林61219 2019-10-10 10:39:36

https://img1.sycdn.imooc.com/szimg/5d9e99da09ce5e8009890472.jpg

HTML代码

0 回复 有任何疑惑可以回复我~
收起回答
取消 回复
提问者 weixin_宝慕林61219 2019-10-10 10:37:15


https://img1.sycdn.imooc.com//szimg/5d9e987809c4fd3c10210701.jpg

https://img1.sycdn.imooc.com//szimg/5d9e987909da4fd610210701.jpg


Js加入了alert("test"); 之后，修改商铺信息，清除了浏览器缓存，clean了服务器，点击提交按钮，test没有打印出来。浏览器控制台也没有报错。https://img1.sycdn.imooc.com//szimg/5d9e994b09ebf87609130279.jpg

0 回复 有任何疑惑可以回复我~
收起回答
取消 回复
翔仔 2019-10-08 00:13:03

同学好，控制台没有报错信息---不光是eclipse的控制台，还要打开chrome的开发者模式的控制台看看有没有报错信息。必要的时候可以清空一下页面缓存，clean一下tomcat试试。

此外，如果不奏效，可以在你的ajax里面，加入error:function(){} 先前只有success:function(){}

具体可以参考 

https://www.cnblogs.com/feixiablog/p/8809925.html


0 回复 有任何疑惑可以回复我~
收起回答
  • 提问者 weixin_宝慕林61219 #1 
    chrome控制台也没有报错信息，clean了Tomcat，清除了浏览器缓存，
ajax里面也加了 error：function
再次运行，还是没有修改成功，断点也还是跳不进去，好像#submit控件的 click方法压根就没有被执行。
请问老师这是什么原因呢
    回复 有任何疑惑可以回复我~ 2019-10-08 01:05:47
  • 翔仔 回复 提问者 weixin_宝慕林61219 #2 
    感觉是提交的按钮压根就跟这个id对应不上？看看这个提交按钮的id是不是submit？
    回复 有任何疑惑可以回复我~ 2019-10-08 23:15:42
  • 提问者 weixin_宝慕林61219 回复 翔仔 #3 
    控件名字和js方法里面都是 submit，没错的，我看其他同学好多也出现了和我一样的问题也是没有解决。如果先不解决，可以继续往后做吗
    回复 有任何疑惑可以回复我~ 2019-10-09 06:59:21
点开查看后面3条评论
取消 回复

相似问题

添加店铺页面点击提交能够响应，更新店铺页面点击提交不响应
1008 1 15
点击提交按钮无响应
899 0 5
关于编辑页面或者新增页面点击“提交”后效果
731 0 6
登录时加入“@”页面无反应
933 1 6
修改密码页面点击提交按钮没反应
1849 1 4

登录后可查看更多问答，登录/注册

问题已解决，确定采纳
还有疑问，暂不采纳
Java双版本（SSM到SpringBoot）校园商铺全栈开发
  • 参与学习       5125    人
  • 解答问题       8145    个

SSM商铺V1.0，解决毕设痛点；SpringBoot商铺V2.0，满足工作刚需

了解课程

本课精华内容

问答 作业

无法进入DEBUG模式

2.0k 47

getshopbyid不能返回数据显示在前端

2.0k 41

停止访问网页问题已解决，但是扫码又出现scope不能为空的错误。。。。。

2.7k 40

request.getParameter()取出的值为空

2.0k 39

老师，操作台报错说类似这样的，数据库的字段和输入的数据库的数据类型不匹配，查了半天没发现有错啊

1.6k 37

查看更多本课问答
微信客服

购课补贴
联系客服咨询优惠详情

 帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

 公众号

扫描二维码
关注慕课网微信公众号