使用不同类型的Javascript标签在HTML文档中实现全局变量 自定义事件解决方案：

问题描述

情况：：我在HTML文档中使用脚本（a）才能使用特定的SDK。然后，我使用第二个基本脚本（b）来创建Kendo UI表。

我的问题：我尝试通过全局变量将数据从脚本（a）传递到脚本（b），但是它不起作用，该怎么办？

可能会帮助您的信息

• 我的文档是由标签框住的表单
• 我用Camunda。第一个脚本允许我使用SDK检索与正在处理的表单关联的实例的ID。 （但我不认为这是问题的症结所在）
• 我假定浏览器会同时读取两个脚本，这就是为什么脚本（b）不能仅仅因为尚未在脚本（a）中创建变量而无法读取变量的原因。

代码：

    
        
    <script type="text/javascript" src="http://localhost:8080/camunda/app/tasklist/scripts/kendo.all.min.js"></script>
    <script cam-script type="text/form-script">
        var taskService = camForm.client.resource('task');
        var processInstanceId = null;
        var result = null;
        taskService.get(camForm.taskId,function(err,task) {
            //alert(JSON.stringify(task));
            debugger;
            processInstanceId = task.processInstanceId;
            $.get("http://localhost:8080/engine-rest/process-instance/"+processInstanceId+"/variables",function(result) {
                debugger;
                window.alert("coucou");
                console.log(result.JsonWeightSetpoints.value);
            });
            debugger;
            console.log(result.JsonWeightSetpoints.value);
            debugger;
        });
    </script>
    <script type="text/javascript">
            console.log(result.JsonWeightSetpoints.value);
            //this is where I implement the Kendo UI grid
    </script>
    <div id="grid"></div>

我无法读取脚本（b）中结果变量的内容，因为它没有定义。

我该怎么做？

解决方法

自定义事件解决方案：

<script type="text/javascript" src="http://localhost:8080/camunda/app/tasklist/scripts/kendo.all.min.js"></script>
<script cam-script type="text/javascript">
        var taskService = camForm.client.resource('task');
        var processInstanceId = null;
        var result = null;
        taskService.get(camForm.taskId,function(err,task) {
            //alert(JSON.stringify(task));
            debugger;
            processInstanceId = task.processInstanceId;
            $.get("http://localhost:8080/engine-rest/process-instance/"+processInstanceId+"/variables",function(result) {
                debugger;
                window.alert("coucou");
                console.log(result.JsonWeightSetpoints.value);

                // the value is available here,we now can trigger an event and send it
              document.dispatchEvent(new CustomEvent("handler",{
                detail: { value: result.JsonWeightSetpoints.value }
              }));
            });
            debugger;
            console.log(result.JsonWeightSetpoints.value);
            debugger;
        });
    </script>
<script type="text/javascript">
  console.log(result.JsonWeightSetpoints.value);
  //this is where I implement the Kendo UI grid

  // event listener,this would get executed only when we want
  document.addEventListener("handler",function(event) {
    // write you logic here
    console.log(event.detail.value);
  });
</script>
<div id="grid"></div>

有用的资源：

1. MDN: Creating and triggering events
2. Introducing asynchronous JavaScript