jquery进行表单弹出框

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jQuery Form Popup</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <form id="myForm">
        <input type="text" id="username" placeholder="Enter your username">
        <button type="button" id="submitBtn">Submit</button>
    </form>

    <script>
        $(document).ready(function() {
            $('#submitBtn').click(function() {
                var username = $('#username').val();
                if (username === '') {
                    alert('Username cannot be empty!');
                } else {
                    if (confirm('Are you sure you want to submit this form?')) {
                        // 这里可以添加表单提交的逻辑
                        alert('Form submitted successfully!');
                    }
                }
            });
        });
    </script>
</body>
</html>