从复合组件执行JavaScript

如何解决从复合组件执行JavaScript

| 美好的一天，我有一个困扰我几个小时的问题。非常简单。呈现复合组件时，我尝试调用/执行JavaScript。就像您可以使用html标签正文和onload一样。 如何引用要执行的嵌入式JavaScript？

<cc:implementation>
    <meta name=\"viewport\" content=\"initial-scale=1.0,user-scalable=no\" />
    <script type=\"text/javascript\" src=\"http://maps.google.com/maps/api/js?sensor=false\" />
    <div id=\"#{cc.clientId}\" >

        <div id=\"map_canvas\" style=\"width: 850px; height: 350px; padding: 1px; border: darkblue\" />

        <script>init();</script>

        <script type=\"text/javascript\">
            var map = null;
            function init() {
                var latlng = new google.maps.LatLng(51.5001524,-0.12623619);
                var myOptions = {
                    zoom: 7,center: latlng,mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                map = new google.maps.Map(document.getElementById(\"map_canvas\"),myOptions);
            }
        </script>
    </div>
    </cc:implementation>

我已经尝试过this.init（），＃{cc.clientId} .init（），但是在上下文中找不到JS。如果我从JSF / ajax组件执行它，则只需\“ init（）; \”即可正常工作     

解决方法

        在定义函数之前，您正在调用ѭ1。 将调用放在函数定义之后。

<script type=\"text/javascript\">
    var map = null;
    function init() {
        var latlng = new google.maps.LatLng(51.5001524,-0.12623619);
        var myOptions = {
            zoom: 7,center: latlng,mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById(\"map_canvas\"),myOptions);
    }
</script>
<script>init();</script>

或者只是摆脱函数调用，而直接执行它。它在定义了ѭ3executed之后就可以执行了。

<script type=\"text/javascript\">
    var map = null;
    var latlng = new google.maps.LatLng(51.5001524,-0.12623619);
    var myOptions = {
        zoom: 7,mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById(\"map_canvas\"),myOptions);
</script>

与具体问题无关：您的复合组件存在另一个设计缺陷。在同一视图中，不能多次重复使用此组件。您最终将在HTML中使用多个

<div id=\"map_canvas\">

元素。在HTML中包含多个具有相同“ 6”的元素是非法的。相应地修复它：

<div id=\"#{cc.clientId}_map_canvas\" ...>

和

... document.getElementById(\"#{cc.clientId}_map_canvas\") ...