简体   繁体   English

在没有onclick的情况下运行Javascript函数

[英]Run Javascript function without onclick

I have a Javascript function for creating new form elements on a web page. 我有一个Javascript函数,用于在网页上创建新的表单元素。 The function is called by an onclick event. 该函数由onclick事件调用。

I can't figure out how to run the function without the onclick event. 没有onclick事件,我无法弄清楚如何运行该函数。 I need to do this as I have Python code generating content to prepopulate the form elements, but still wish to be able add and remove the form elements dynamically with the Javascript. 我需要这样做,因为我有Python代码生成的内容来预填充表单元素,但仍然希望能够使用Javascript动态添加和删除表单元素。

Javascript function: JavaScript函数:

    pcount = 0;
    createinputprice =function (){
        field_area = document.getElementById('pricetable');
        var tr = document.createElement("tr");
        var cella = document.createElement("td");
        var cellb = document.createElement("td");
        var input = document.createElement("input");
        var input2 = document.createElement("input");
        input.id = 'descprice'+pcount;
        input2.id = 'actprice'+pcount;
        input.name = 'descprice'+pcount;
        input2.name = 'actprice'+pcount;
        input.type = "text";
        input2.type = "text";
        cella.appendChild(input);
        cellb.appendChild(input2);
        tr.appendChild(cella);
        tr.appendChild(cellb);
        field_area.appendChild(tr);
        //create the removal link
        var removalLink = document.createElement('a');
        removalLink.onclick = function(){
            this.parentNode.parentNode.removeChild(this.parentNode)
        }
        var removalText = document.createTextNode('Remove Field');
        removalLink.appendChild(removalText);
        tr.appendChild(removalLink);
        pcount++
    }

HTML: HTML:

<table id="pricetable">
</table>
<a href='#' onclick="createinputprice()">Add Price</a>
<script type="text/javascript">
    createinputprice();
</script>

The onclick event works fine in JSFiddle but calling the function directly doesn't work at all. onclick事件在JSFiddle中可以正常工作,但是直接调用该函数根本不起作用。

you can put it into tag using 'onload' event: 您可以使用“ onload”事件将其放入标签中:

<body onload='yourfunction()'>

or just use jQuery: 或者只是使用jQuery:

$(document).ready(function() {
    yourFunc();
});

I suppose you could use <body onload="yourfunction()"> you also should look into http://www.w3schools.com/js/js_htmldom_events.asp . 我想您可以使用<body onload="yourfunction()">您还应该查看http://www.w3schools.com/js/js_htmldom_events.asp

As you can see there are quite a few events available in javascript one should allways pick the right tool(event) for doing the work. 如您所见,javascript中有很多可用的事件,应该始终选择正确的工具(事件)来完成工作。

If you want to call jquery function on Page load: you can use $(document).ready(function(){}); 如果要在页面加载时调用jquery函数:可以使用$(document).ready(function(){});

For example: 例如:

Jquery- Jquery-

<script type="text/javascript">
    $(document).ready(function(){
       createinputprice();
    });
 </script>

and you can also fire the click event in Jquery: 您还可以在Jquery中触发click事件:

HTML- HTML的

<a id="myLink" href='#' onclick="createinputprice();">Add Price</a>

Jquery- Jquery-

 <script type="text/javascript">
     $(document).ready(function(){
          $('#myLink').click();
     });
 </script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM