单击按钮时，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

好吧，除了我刚刚做的少量谷歌搜索之外，我不知道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部分。