我试图将一个函数分配给一个按钮,但由于某种原因,当页面加载时,即使我没有单击任何内容,该函数也会被执行:
$("#search-button").on("click", searchFunction());
function searchFunction(){...}
最佳答案
您需要传递函数而不是函数的结果。
更改此:
$("#search-button").on("click", searchFunction());
对此:
$("#search-button").on("click", searchFunction);
使用 searchFunction()
以及末尾的 ()
来执行该函数,从而将函数的结果传递给事件处理程序。
像这样传递它时,searchFunction
会按预期传递对函数的引用。
使用 fiddle 中的相关代码:
$("#search-button").on("click", searchFunction);
function searchFunction() {
$(".search-results").append("fefe");
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container-fluid">
<div class="wrapper outer search-form">
<div class="middle">
<div class="inner">
<div class="row">
<div class="col-sm-3">
<span class="input-group-btn">
<a href="https://en.wikipedia.org/wiki/Special:Random">
<button class="btn btn-secondary" type="button">Random Article</button>
</a>
</span>
</div>
<div class="col-sm-3">
<div class="input-group">
<input type="text" class="form-control" id="search-string">
<span class="input-group-btn">
<button class="btn btn-secondary" type="button" id="search-button">Search</button>
</span>
</div>
</div>
</div>
</div>
<div class="wrapper outer">
<div class="middle">
<div class="inner search-results">
</div>
</div>
</div>
</div>
关于javascript - Jquery onclick 函数在页面加载时执行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48462502/