Question

所以这是我的问题。

我正在使用Wordpress开发并使用插件管理酒店预订流程。

生成表单并且没有类/ ids，所以我必须通过jQuery找到它。

jQuery(document).on('ready', function(){
    // Clicking on submit button 
    jQuery('.booking-buttons input[type="submit"]').on('click', function( evt ) {
        if ( validation() ) {
            console.log('yes');
            return true;
        } else {
            console.log('no');
            evt.preventDefault();
            return false;
        }
    });

    validation = function() {
        // if fields validate 
            // return true
        // else
            // return false
        // return false
    }

});

我也尝试了各种onsubmit / click变体，表单仍然提交无论如何，代码也已经放在插件JS包含之前和之后，仍然没有乐趣。

有趣的是，它适用于Chrome Canary，但没有别的。

有没有其他人有这样的问题并有任何指导？

由于

Answer 1

您只需在HTML中使用：

<form onsubmit="return validation()">

或者如果你真的想使用jQuery：

$("form").submit(function(){return validation();});

Answer 2

请尝试附加到表单submit事件：

// Shorter DOM ready with local $ for shorter/standard jQuery code
jQuery(function($){
    // Clicking on submit button 
    $('.booking-buttons').closest('form').submit(function( evt ) {
        if ( validation() ) {
            console.log('yes');
            return true;
        } else {
            console.log('no');
            evt.preventDefault();
            return false;
        }
    });

    validation = function() {
        // if fields validate 
            // return true
        // else
            // return false
        // return false
    }

});

根据您的评论：因为它在DOM就绪处理程序中，唯一的其他问题可能是动态表单创建。

在这种情况下，使用委托事件处理程序：

E，.G。

// Shorter DOM ready with local $ for shorter/standard jQuery code
jQuery(function($){
    // Clicking on submit button 
    $(document).on('submit', 'form:has(".booking-buttons")', function( evt ) {
        if ( validation() ) {
            console.log('yes');
            return true;
        } else {
            console.log('no');
            evt.preventDefault();
            return false;
        }
    });

    validation = function() {
        // if fields validate 
            // return true
        // else
            // return false
        // return false
    }

});

这样做的好处是它可以处理动态创建的表单。基本上它捕获所有提交事件冒泡到文档，然后应用jQuery过滤器，然后将函数应用于导致事件的任何匹配元素

如果您在页面上允许多个表单，则需要将“当前”表单传递给验证方法：

// Shorter DOM ready with local $ for shorter/standard jQuery code
jQuery(function($){
    // Clicking on submit button 
    $(document).on('submit', 'form:has(".booking-buttons")', function( evt ) {
        if ( validation($(this)) ) {
            console.log('yes');
            return true;
        } else {
            console.log('no');
            evt.preventDefault();
            return false;
        }
    });

    validation = function($form) {
        // if fields within $form are validate 
            // return true
        // else
            // return false
        // return false
    }
});

Answer 3

<script type="text/javascript">
    function validateForm() {
        var x = document.getElementById('test').value;
        if (x == null || x == 0 || x == "0") {
            alert("Stop");
        }
        else
            document.form.submit();
    }
</script>

检查，但我没有重写你的代码..我从我的项目中使用它，我给你举个例子

表格上不能返回false

3 个答案: