单击按钮时调用Javascript函数

Question

这是我的javascript代码，但是在每个页面上加载javascript函数都被调用，我只想在单击按钮时调用它

            <input onclick="myFunction()"  id="btnAdd" type="button" class="btn-sm btn-default pull-right" value=" Add Qualification">

这是我的Javsacript函数

<script type="text/javascript">


    function myFunction() {

        document.getElementById("btnAdd").onclick = function () { 
            $("#demo").load("@Html.Raw(Url.Action("_Experience", "Students")) ")
        };
    }
</script>

Answer 1

如果使用

document.getElementById("btnAdd").onclick = function () { 
        $("#demo").load("@Html.Raw(Url.Action("_Experience", "Students")) ")
    };

此代码然后无需使用myFunction方法并从html中删除onclick。或者，您可以只在myFunction方法和document.getElementById("btnAdd").onclick中编写登录名，然后像这样在HTML中添加onClick

<input onclick="myFunction()"  id="btnAdd" type="button" class="btn-sm btn-default pull-right" value=" Add Qualification">

<script type="text/javascript">
    function myFunction() {
        $("#demo").load("@Html.Raw(Url.Action("_Experience", "Students")) ")
    }
</script>

Answer 2

<script type="text/javascript">

        document.getElementById("btnAdd").onclick = function () { 
            $("#demo").load("@Html.Raw(Url.Action("_Experience", "Students")) ")
        };

</script>

只需移除myFunction()

Answer 3

这是您唯一需要的。https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onclick

并使用此函数，它是一个自执行函数，可确保您的函数不会在页面加载时被调用。但仅在单击按钮时

// self executing function here
(function() {
   // your page initialization code here
    function myFunction() {
      document.getElementById("btnAdd").onclick = function () { 
        $("#demo").load("@Html.Raw(Url.Action("_Experience", "Students")) ")
      };
    } 
})();
</script>

Answer 4

尝试此代码，一个简单的解决方案

<input id="btnAdd" type="button" class="btn-sm btn-default pull-right" value="Add Qualification">

<script type="text/javascript">

    var Btnid = document.getElementById("btnAdd");

    Btnid.addEventListener('click', function(e) {
       alert('Event works only when it clicks')
    });

</script>