input 輸入特殊符號可以繞過 return event.key原理?

jquery #javascript

qpalzm 2020-10-20 17:25:36 ‧ 1498 瀏覽

分享至

想請問為甚麼input已經有做處理了,enter鍵按下程式如下:

  $(document).on("keypress", "form", function(event) {
            let  code = event.keyCode ? event.keyCode : event.which;
            console.log(code);
         
            return event.key != "Enter";
        });

已經將enter鍵判斷按下不會submit了,但是輸入框中只要有任一特殊符號:<!$#@,如下:

為甚麼就可以避開進行submit,想問是甚麼原理可以繞過??

看更多先前的討論...收起先前的討論...

淺水員 iT邦大師 6 級 ‧ 2020-10-20 18:25:12 檢舉

請求不一定需要透過網頁，也可能是其它工具發出來的

淺水員 iT邦大師 6 級 ‧ 2020-10-20 18:33:23 檢舉

另外只看keycode好像複製貼上就繞過了

qpalzm iT邦研究生 5 級 ‧ 2020-10-21 08:36:42 檢舉

目前推測的原因有可能是因為<>被html解析成元件,所以會被繞過,謝謝解答~

㊣浩瀚星空㊣ iT邦大神 1 級 ‧ 2020-10-21 09:20:01 檢舉

原因最好不要用推測，請善用f12大法來查看你的實際原因。
另外，你的寫法其實是多餘的。

你是將所有的key動作給停用了。而不是單純的enter。
要抄也得要了解其動作原理是什麼。不要只是會抄。

qpalzm iT邦研究生 5 級 ‧ 2020-10-21 09:38:22 檢舉

謝謝星空大的建議,但我想說不是用抄的,如果寫得不好再改進。目前還找不到原因,所以我只能先用推測再去測試,並不是寫得不好就是用抄的,謝謝您

㊣浩瀚星空㊣ iT邦大神 1 級 ‧ 2020-10-21 11:06:37 檢舉

我想你還是不懂我的意思。
還能再那邊說你不是用「抄」的。

你沒發現我並沒有說你是用「ctrl c+v」大法了?

我明白這是你自已寫的。
但我的意思是你也一定是參考或是查看某些地方。將其key上去。
但在key上去的同時，你得了解其原理。
要不然就等同是「抄」過來而已。

你也可以將我說的「抄」當成你的「寫不好」來自我安慰也行。
重點是你得要知道你的問題在哪，而不是還來反駁我說的「抄」是錯誤的。
完全沒意義啊。

我講話很不客氣。不能理解就算了。

qpalzm iT邦研究生 5 級 ‧ 2020-10-21 11:46:05 檢舉

我可以接受您的想法,那我也只能說學習路上,發現問題,先找資料找不到發問,被人發現問題檢查修改,我也虛心接收,關於這個問題我只想問為甚麼可以避開而已,按f12檢查
也只會看到送出的表單內容,所以我才會來發問的。謝謝您的建議

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

japhenchen

iT邦超人 1 級 ‧ 2020-10-21 08:23:58

最佳解答

改用keydown並加入preventDefault

$(function(){
    $(document).on("keydown", "#tbLabelContent", function (e) {
        if (e.which === 13) { // 13 = enter鍵
            e.preventDefault();
            return false;
        }
    });
});

回應 3
分享
檢舉

qpalzm iT邦研究生 5 級 ‧ 2020-10-21 08:34:11 檢舉

謝謝大大~我想知道為甚麼輸入特殊符號可以跳過規則?有可能被html判斷成標籤<>嗎?

japhenchen iT邦超人 1 級 ‧ 2020-10-21 09:09:50 檢舉

送回後端前把POST出去的內容做escape處理就不會出現大於小於...

var mySubmit = function () {
    $.post({
        url: './',
        dataType: 'json',
        data: {
            action: "PrintLabelTypeA",
            text: convert($("#tbLabelContent").val()),
            count: $("#tbCount").val()
        }
    })
        .done(function (d) {
            alert(`${d.text}列印工作已送出，請稍候領取`);
            $("#tbLabelContent").val("");
            $("#tbCount").val("1");
            
        });
};
function convert(str) {
    str = str.replace(/&/g, "&");
    str = str.replace(/>/g, ">");
    str = str.replace(/</g, "<");
    str = str.replace(/"/g, """);
    str = str.replace(/'/g, "'");
    return str;
}

前端HTML畫面