尝试从另一个JavaScript更改JavaScript变量

Question

I'm trying to use an external tool called yEd within my website.

I created a select with some graphs as values and when the user clicks on an option the graph will show up.

<div class="col-sm-3">    
    <select multiple class="form-control" id="graph" name="graph" >
        <option value="yed/files/hardware/1.graphml">#1</option> <!-- GET value of this option-->
        <option value="files/hardware/2.graphml">#2</option>
        <option value="files/hardware/3.graphml">#3</option>
    </select>
</div>

<input type="button" id="change" value="change">

<div id="graph">
    <script type="text/javascript" language="javascript">
            <!--

            if (!RunPlayer(
                "width", "100%",
                "height", "100%",
                "graphUrl", "yed/files/hardware/1.graphml", //PUT here when option is clicked and reload the graph
                "overview", "true",
                "toolbar", "true",
                "tooltips", "false",
                "movable", "true",
                "links", "true",
                "linksInNewWindow", "true",
                "viewport", "full"
                )) {
              if (!InstallFlashUpdate("width", "100%", "height", "100%")) {
                document.write('This content requires the Adobe Flash Player Version 9.0.38 or higher. '
                    + '<a href=http://www.adobe.com/go/getflash/>Get Flash</a>');
              }
            }



            //-->
    </script>
</div>

I tried with javascript like so:

<script type="text/javascript">
var a = "yed/files/hardware/1.graphml";
function showDiv(toggle){
    a = "yed/files/hardware/2.graphml";

}
</script>

But it failed miserable.

Any advices? Thank you

--- LATER EDIT

I tried this but it reloads the page, the viwer starts but the graph doesn't load.

<script type="text/javascript" language="javascript">
        <!--

            var graph = "yed/files/hardware/1.graphml";

            RunPlayer(
            "graphUrl", graph,
            "overview", "true",
            "toolbar", "true",
            "tooltips", "false",
            "movable", "true",
            "links", "true",
            "linksInNewWindow", "true",
            "viewport", "full"
            );

             $("#graph").change(function () {
                    var graph = $("#graph").val();
                    RunPlayer(
                        "graphUrl", graph,
                        "overview", "true",
                        "toolbar", "true",
                        "tooltips", "false",
                        "movable", "true",
                        "links", "true",
                        "linksInNewWindow", "true",
                        "viewport", "full"
                        );
                });



        //-->
</script>

The variable is set correct.

Answer 1

A couple things:

For readability, I would do this part first instead of nesting it inside another conditional:

if (!InstallFlashUpdate({width: "100%", height: "100%")) {
    document.write(
        'This content requires the Adobe Flash Player Version 9.0.38' +
        'or higher. <a href="http://www.adobe.com/go/getflash/">'+
        'Get Flash</a>'
    );
}
else{

It looks like you mean to pass in a plain object to RunPlayer. I would define it first and then pass it in:

var settings = {
            width: "100%",
            height: "100%",
            graphUrl: "yed/files/hardware/1.graphml",
            overview: true,
            toolbar: true,
            tooltips: false,
            movable: true,
            links: true,
            linksInNewWindow: true,
            viewport: "full"
};

Now run it as is when the user hasn't selected anything:

RunPlayer(settings);

However, we still don't have it changing when the user changes options. We do that by adding a listener that runs an anonymous function that:

Step 1. Changes graphUrl in our settings to the value in our drop down. Step 2. Calls RunPlayer again with the changed settings.

var urlChanger = document.getElementById('change');

urlChanger.addEventListener('change', function(event){
    settings.graphUrl = event.target.value; //step 1
    RunPlayer(settings); //step 2
});

}//close your else