Giả sử ta có input có ô input như sau

<input type="number" class="input-text qty text" name="qty" value="9" min="1" max="9" step="1">

jQuery(document).ready(function($) {

    // Ngăn không cho nhập ký tự không hợp lệ
    $(document).on('keydown', '.qty', function(e) {
        const allowedKeys = [8, 9, 27, 13, 46, 37, 38, 39, 40]; // Backspace, Tab, Escape, Enter, Delete, Arrow keys

        // Nếu nhấn tổ hợp phím Ctrl+A, Ctrl+C, Ctrl+V, Ctrl+X thì cho phép
        if (
            (e.ctrlKey || e.metaKey) && 
            (e.key === 'a' || e.key === 'c' || e.key === 'v' || e.key === 'x')
        ) {
            return;
        }

        // Ngăn nhập ký tự không phải số
        if (
            !allowedKeys.includes(e.keyCode) && // Không phải phím đặc biệt
            (e.keyCode < 48 || e.keyCode > 57) && // Không phải số trên hàng phím thường
            (e.keyCode < 96 || e.keyCode > 105) // Không phải số trên Numpad
        ) {
            e.preventDefault();
        }
    });

    // Xử lý các trường hợp người dùng dán hoặc nhập ký tự không hợp lệ
    $(document).on('input', '.qty', function () {
        const $this = $(this);
        const value = $(this).val();

        // If the value is not a number, reset the value to 1
        if (!/^\d+$/.test(value) || value === '') {
            $this.val(1);
        }
    });
});

 

Bài viết liên quan

post-no-image

Update post meta ACF sử dụng Rest API WordPresss

post-no-image

Hướng dẫn làm phần compare products trong Woocommerce

post-no-image

Loadmore product woocommerce infinity scroll

post-no-image

Add the Meta Box Upload Multiple Images and multiple metabox

post-no-image

Add the Meta Box Repeat

post-no-image

Kỹ thuật debounce trong javascript – Trì hoãn nhập từ khóa trong ô input