自动运行jQuery方法&从jQuery属性调用onClick方法

Question

我在和jQuery做斗争。请帮帮我..。

加载页面时，jQuery函数将自动执行，同时，我希望通过单击按钮实现此函数。

之前

加载页面后，立即自动执行jQuery函数。

并且，当单击按钮时没有响应。

html

<button type="button" class="btn btn-primary btn-sm" id="btn_add">LookUp</button>

jQuery

<script type="text/javascript">
        
        $(function() { 

            ..skip..

        });

</script>

现状

加载页面后，不会自动执行jQuery函数。

但是，当点击按钮时，它工作得很好。

html

<button type="button" class="btn btn-primary btn-sm" id="btn_add" onclick="$(this).Lookup();">Lookup</button>

jQuery

<script type="text/javascript">

        $.fn.Lookup = function() {

            ..skip..

        };

</script>

目标

加载页面后，保持jQuery函数自动运行。

实现使jQuery函数即使在单击LookUp按钮时也能工作。

我该怎么解决这个问题？

Answer 1

您应该做的是为Lookup创建一个函数，然后在文档ready和按钮单击期间调用该函数。请参考代码片段。如果你不理解代码，我很乐意进一步解释。

编辑:而且，理想情况下，$.fn.<xyz>应该用于扩展/创建通用功能，而不是用于特定/页面特定功能。

​

$(function(){
    //This will bind Lookup function to the button click event
    $("#btn_add").on("click", Lookup);
    //This will immediately call the Lookup function on document ready event (startup)
    Lookup();
});

function Lookup() {
  //do something
  alert("Looking up");
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button type="button" class="btn btn-primary btn-sm" id="btn_add">LookUp</button>

​