js生效后页面自动刷新的问题(js控制button,生效效果闪一下消失)解决
js生效后页面自动刷新的问题(js控制button,生效效果闪一下消失)解决
刘昌鑫 发表于1年前
js生效后页面自动刷新的问题(js控制button,生效效果闪一下消失)解决
  • 发表于 1年前
  • 阅读 19
  • 收藏 0
  • 点赞 0
  • 评论 0
摘要: 遇到了js执行完成后自动刷新页面的问题。js生效后自动刷新导致js效果闪一下又消失

    今天工作中需要用到js点击Edit按钮时把按钮变为submit,并且页面中asp.net控件改为可编辑状态(页面加载默认只读)。

    遇到问题:点击Edit时,按钮闪了一下submit,页面可编辑闪了一下,又恢复了加载页面的默认只读状态。

    问题原因:调试js找到原因是js执行结束后页面重新加载了一遍,导致js效果看起来闪了一下又失效了。<button type="submit" ></button>没注意这个type=submit, submit会默认提交数据,重新加载页面。

   解决方法:把type=“submit”改为type=“button”即可。

 

1.按钮代码

<button type="submit" id="EditOrSub" class="btn btn-success">Edit</button>

2.js

<script type="text/javascript">
            $("#EditOrSub").click(function () {
                if ($("#EditOrSub").val() == "Edit") {
                    $("#EditOrSub").val("Submit");
                    $(":input").attr("readonly", false);
                    $("#listEdit").hide();

                }
                else if ($("#EditOrSub").val() == "Submit") {
                    //此处不展示了,省略
                }
            });
</script>

3.问题解决

 

 

<button type="button" id="EditOrSub" class="btn btn-success">Edit</button>

 

 

 

以前经常用<input type="button"/>  很少用<button></button>所以没注意到。。随笔记下,希望遇到同样问题的朋友能看到,

共有 人打赏支持
粉丝 4
博文 49
码字总数 11516
×
刘昌鑫
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: