jQuery 函数不是在按钮单击时从 JSF 调用

Question

我有一个包含函数的 jQuery 文件。当我的页面加载时，我的脚本就会运行。表示调用。这是我的 jQuery 文件。

(function($){

    var $firstPara = $('p').eq(1);
    $firstPara.hide();

    function checkValidation() {

        var labelElementArray = $("label.mandotary");
        var inputElementArray = $("input.mandotary");
        var selectElementArray = $("select.mandotary");

        $.each(inputElementArray, function(index, element){

            var text = $(element).text();


        }); //end of $.each(inputElementArray, fn)

        $.each(selectElementArray, function(index, element) {

            ////nothing

        }); //end of  $.each(selectElementArray, fn)

    } //end of function checkValidation()

})(jQuery); //end of (function($){}

我有 JSF 表单，里面有按钮。

<h:head>
    <title>Facelet Title</title>
    <h:outputScript library="javascripts" name="jquery.js"  target="body"/>
    <h:outputScript library="javascripts" name="validation.js" target="body"/>

</h:head>

<h:body>

    <h:form id="validationFrom" >

        <h:commandButton id="saveButton"
                         value="Save"
                         onclick="checkValidation()"/>


        <h:commandButton id="cancelButton"
                         value="Cancel" />

    </h:form >

</h:body>

现在当我点击保存按钮时，它说 checkValidation() 函数未定义。为什么？ 我在这里做错了什么？

谢谢

Answer 1

尝试删除

(function($){ 和

})(jQuery); //end of (function($){}

来自 js 文件

相反，用这个地方包装你的 js 代码

$(document).ready(function() {

});

还有一件事

编辑：

将其添加到页面顶部

    <h:outputScript library="primefaces" name="jquery/jquery.js"
        target="head" />
    <h:outputScript target="head">
        $ = jQuery;
    </h:outputScript>

为了在你的 jQuery 代码中使用 $

Answer 2

Welp，除了我刚刚做的少量谷歌搜索之外，我不知道 JSF 是什么，而且我也不熟悉您使用的一些 jQuery 语法。假设您可以像处理任何常规的旧 html 页面一样处理 JSF 页面，这就是我的做法......

$(function() {
    // Do any work you want to occur when the DOM is ready here.

    $("#saveButton").click(checkValidation);
}

function checkValidation() {
    // Check validation here
} 

然后在 JSF 中去掉你的 onclick 位。