如何从html代码中调用函数

Question

我有 JS 代码，可以正常工作。但是从函数中调用“islandA.onclick”，我需要从外部调用它 - 从 HTML 代码。（还有更多的岛屿:)

    $(document).ready(function(){
        var islandA = document.getElementById("ostrovA");

        var websocket = new WebSocket("ws://localhost:8090/php-socket.php");
        
        islandA.onclick = function(event) {
                var messageJSON = {
                    team: '0001',
                    function: 'moveBoat'
                };
                websocket.send(JSON.stringify(messageJSON)); 
        }
        websocket.onmessage = function(event) {
            var Data = JSON.parse(event.data);
            moveBoat (); 
        };        

    });

需要的调用方式是 <img src='img/island.png' id='isladnA' onclick='hereSouldBetheCalling()'>

使用（和修改）来自 https://www.php.net/manual/en/function.socket-create.php 的代码非常感谢:)

Answer 1

您可以将其放入您的 $(document).ready

var websocket = new WebSocket("ws://localhost:8090/php-socket.php");
 
 
$('#islandA').on('click', function(){

    var messageJSON = {
        team: '0001',
        function: 'moveBoat'
    };
    websocket.send(JSON.stringify(messageJSON)); 

});

这使用 jquery 的“on”方法来处理该元素的点击事件。如果您有多个要单击的图像，您可以通过为所有这些图像分配一个公共 class 并使用它来识别它们来从单个定义中完成此操作。

class="myIsland" id='isladnA' onclick='hereSouldBetheCalling()'>

$('.myIsland').on('click', function(e){
    // $(e.target)
    //    or
    // $(this)
}

这将绑定一个点击事件来为所有“myIsland”元素调用相同的函数。

如何从html代码中调用函数

How to call the function from htmlcode

html

javascript

function

call

ws