Question

我有一个按钮，应该在点击时调用loadCampaigns（）但是当我点击它时它表示该功能不是一个功能。但是，如果我在控制台中运行loadCampaigns（），它就会运行。它必须变得简单，我在这里失踪了。有什么想法吗？

这是按钮代码：

<button id="loadCampaigns" type="button" class="btn pull-left" onclick="loadCampaigns();">Load</button>

这是脚本：

 <script>

    var availableTags = [];
    $( ".auto-complete" ).autocomplete({
      source: availableTags
    });


    $('#from_username').keydown(function(e){
        if(e.which==13){
            loadCampaigns();
        }else{
            loadUsernameList('#from_username');
        }
    });
    $('#to_username').keydown(function(){
        loadUsernameList('#to_username');
    });



    function loadUsernameList(inputField){
        $.ajax({
            data:{
            username:$(inputField).val()+'%'        
            },url:'/admin/usernameSearch', type: "POST", dataType: "text",
            success:function(data){
                data=$.parseJSON(data);
                if(data.error != undefined){
                    if(data.error !== false){
                        //showError(data.error);
                    }
                    else{
                        $(inputField).autocomplete("option", "source", data.result);
                    }
                }
            } 
        });
    }

    function loadCampaigns(){

        $.ajax({
            data:{
            username:$('#from_username').val()      
            },url:'/admin/loadUserCampaigns', type: "POST", dataType: "text",
            success:function(data){
                data=$.parseJSON(data);
                if(data.error != undefined){
                    if(data.error !== false){
                        //showError(data.error);
                    }
                    else{
                        $('#from_results').html(data.result);
                    }
                }
            } 
        });
    }


</script>

Answer 1

尝试将文档准备好添加到选择器中。它有效吗？

<script>

    var availableTags = [];

    $(document).ready(function(){

        $( ".auto-complete" ).autocomplete({
          source: availableTags
        });


        $('#from_username').keydown(function(e){
            if(e.which==13){
                loadCampaigns();
            }else{
                loadUsernameList('#from_username');
            }
        });
        $('#to_username').keydown(function(){
            loadUsernameList('#to_username');
        });
    })


    function loadUsernameList(inputField){
        $.ajax({
            data:{
            username:$(inputField).val()+'%'        
            },url:'/admin/usernameSearch', type: "POST", dataType: "text",
            success:function(data){
                data=$.parseJSON(data);
                if(data.error != undefined){
                    if(data.error !== false){
                        //showError(data.error);
                    }
                    else{
                        $(inputField).autocomplete("option", "source", data.result);
                    }
                }
            } 
        });
    }

    function loadCampaigns(){

        $.ajax({
            data:{
            username:$('#from_username').val()      
            },url:'/admin/loadUserCampaigns', type: "POST", dataType: "text",
            success:function(data){
                data=$.parseJSON(data);
                if(data.error != undefined){
                    if(data.error !== false){
                        //showError(data.error);
                    }
                    else{
                        $('#from_results').html(data.result);
                    }
                }
            } 
        });
    }


</script>

Answer 2

您的代码本身似乎没问题。这是一个小而完整的例子：

<!DOCTYPE html>
<html>
    <body>
        <button onclick="loadCampaigns();">Load</button>
        <script type="text/javascript">
            function loadCampaigns() {
                alert('hi');
            }
        </script>
    </body>
</html>

我的建议是确保您正确加载JavaScript。

我还要补充一点，手动注册点击事件通常比使用html onclick更好：

$('#loadCampaigns').click(loadCampaigns);

如果这样做，您可以确保在将click事件绑定到它之前定义了loadCampaigns函数。

Answer 3

试试这个，

html代码

 <button id="loadCampaigns" type="button" class="btn pull-left" 
onclick="callLoadCampaigns();">Load</button>

js code，

<script>
function callLoadCampaigns(){

    $.fn.loadCampaigns();

}
    var availableTags = [];
    $( ".auto-complete" ).autocomplete({
      source: availableTags
    });


    $('#from_username').keydown(function(e){
        if(e.which==13){
            callLoadCampaigns();
        }else{
            loadUsernameList('#from_username');
        }
    });
    $('#to_username').keydown(function(){
        loadUsernameList('#to_username');
    });



    function loadUsernameList(inputField){
        $.ajax({
            data:{
            username:$(inputField).val()+'%'        
            },url:'/admin/usernameSearch', type: "POST", dataType: "text",
            success:function(data){
                data=$.parseJSON(data);
                if(data.error != undefined){
                    if(data.error !== false){
                        //showError(data.error);
                    }
                    else{
                        $(inputField).autocomplete("option", "source", data.result);
                    }
                }
            } 
        });
    }

    $.fn.loadCampaigns= function(){

        $.ajax({
            data:{
            username:$('#from_username').val()      
            },url:'/admin/loadUserCampaigns', type: "POST", dataType: "text",
            success:function(data){
                data=$.parseJSON(data);
                if(data.error != undefined){
                    if(data.error !== false){
                        //showError(data.error);
                    }
                    else{
                        $('#from_results').html(data.result);
                    }
                }
            } 
        });
    }
</script>

基本上，当您从html调用onclick，onkeypress等事件的函数为onclick="clickFunction()"或onkeypress="keyPressFunction()"时，您正在调用不是jQuery事件绑定器的javascript函数。

您必须使用$.fn.someFunction = function(){/*some code*/}，然后才能执行$("#someElement").someFunction()。

在我的回答中，我在点击事件上调用callLoadCampaigns()，通过调用loadCampaigns()将其绑定到$.fn.loadCampaigns();，这更易于维护和结构化。

函数不是函数jquery

3 个答案: