Question

我是前端编程的新手，并且在项目中使用了多种新的（对我来说）技术（boostrap，grails，jquery）。因此，对于经验丰富的字体端开发人员来说，以下问题可能是明智之举，所以请幽默我。

问题：我无法弄清楚为什么对我来说，jquery scrip中的button.click函数没有触发。既没有触发警报，也没有触发对URL的实际ajax调用。 .gsp文件的body标签，包括脚本，如下所示。救命啊！

<body>
    <div id="top"/>
    <div class="container-fluid">
        <div class="row">
            <div class="col-xs-1"></div>
            <div class="col-xs-10">
                <div class="input-group">
                    <input id="searchQuery" type="text" class="form-control" placeholder="${message(code: 'search.enterquery', default: 'Enter query')}" >
                    <span class="input-group-btn">
                        <button id="searchButton" class="btn btn-default" type="button"><g:message code="search.search" /></button>
                    </span>
                </div>
            </div>
            <div class="col-xs-1"></div>
        </div>
        <div class="row">
            <div id="searchResults">
                Results will appear here
            </div>
        </div>
    </div>
    <script type="text/javascript" language="javascript">
        $(document).ready(function(){
            $("#searchButton").click(function() {
                alert("button was clicked");
                $.ajax({
                    type: "POST",
                    url: "${g.createLink(controller:'library',action:'search')}",
                    dataType: 'html',
                    data: { query: $("#searchQuery").val()},
                    success:function(result){
                        $("#searchResults").html(result);
                    }
                    error:function() {
                        $('#searchResults').text('An error occurred');
                    }
                    complete:function() {
                    }
                });
            });
        });
    </script>   
</body>

Answer 1

您在成功和错误回调后错过了逗号（，）。

success:function(result){
    $("#searchResults").html(result);
},   //here
error:function() {
    $('#searchResults').text('An error occurred');
}, //here
complete:function() {
}

点击功能上的JQuery按钮不起作用

1 个答案: