Question

我有一个选择对象，如：

<select id="mySelect" onchange = "start()" >
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>

现在，我想根据mySelect的值更改JavaScript。例如，如果它的值是“Apple”，那么我想将JavaScript设置为“Apple.js”。另外，我在页面中有一个包含函数start（）的JavaScript。我希望新的JavaScript能够覆盖现有的JavaScript。怎么做到这一点？

Answer 1

您可以动态加载脚本：

$.loadScript('Apple.js', function(){//url you can specify
    //Yayhhh!! your script loaded
});

或使用getscript()

$.getScript( "ajax/test.js", function( data, textStatus, jqxhr ) {
    //Yayhhh!! your script loaded
});

正如您在start()事件中提到onchange()，您可以使用：

HTML片段：

<select id="mySelect" onchange = "start(this.value)" >
                                        ^^^^^^^^^^====>passing current selected value

脚本：

var start = function(val){
    if(val == 'Apple'){
        $.getScript( "ajax/test.js", function( data, textStatus, jqxhr ) {
          console.log( data ); // Data returned
          console.log( textStatus ); // Success
          console.log( jqxhr.status ); // 200
          console.log( "Load was performed." );
        });
    }
}

Answer 2

function start(){
  console.log("test");
}
function start(){
 console.log("test2");
}

start()

尝试在浏览器的“控制台”面板中执行此代码。你会看到它给你看test2。当你加载一个与之前名称相同的新函数时，只需用新的函数覆盖旧函数。

只需通过$.getScript加载javascript即可从新文件中加载您的函数。

如何动态更改页面的javascript？

2 个答案: