VUE enter 回車 導致 頁面重新整理解決
阿新 • • 發佈:2019-02-03
分頁中需要 輸入頁碼進行跳轉,但是卻出現 跳到指定頁面後,頁面也重新整理了。從而無法滿足無重新整理的分頁。最初程式碼如下:
<form class="zh-skip" action="">
<input type="number" v-model="pageNumber" oninput="if(value<1)value=1" @keyup="goPageKeyUp($event)">
<button class="zh-btn-blue" type="button" @click="goPage()">跳轉</button>
</form>
網上找資料後,得知造成 頁面重新整理的原因是:
外層有form表單,回車導致form表單提交
解決方法:
(1)去除外面的form表單
(2)在form表單內加一個input文字框, 一個表單下,如果只有一個文字框時,按下回車將會觸發表單的提交事件
(3 )在input加阻止事件
<input onkeypress="if (event.keyCode == 13) showResult();"/>