form标签导致点击button页面被清空
注意看啊这是一个很普通的按钮
但是
如果我们把它放到了一个form表单里边
注意看像这样
我再次点击它的时候呢注意啊… 大家看!
它就会变成了一个提交按钮
我们可以再加一个按钮来验证一下
button2 然后呢我们再写一个input(输入框)
注意看这里面写点东西
button2没问题,但是button1呢
大家看就刷新了
所以啊
像这种button标签它也是有type的
我们把它type写成button
大家看我们再来试试
大家看这样就可以了
如果我们不写呢
其实就像以前的input type=submit一样
好最后咱们再来看
有小伙伴发来的bug啊
他写了一个简单的生成这个
渐变代码的工具
然后点这个复制代码
他就出bug了
大家看代码是复制了
但是呢
页面刷新了
其实原因就是因为他把这个button
放在了一个form表单里
那我们除了在这加一个type="button"
还有什么方法吗
大家看现在是type等于button
这样就可以了
其实还有一个方法
就是前面这个按钮它没有问题
原因是什么呢
它在前面这个按钮的点击事件里
第一句加了一个event.preventDefault()
有了这个它就会阻止原生的那个事件
所以呢我们在第二个
按钮的点击方法里也加一个
我们先在这加一个event接收一下
好然后再加一个
我们再把原声的这个type=button去掉
好
然后呢
生成一个,这回复制,注意~ 也没有问题了
最后更新于
这有帮助吗?