Question

我写了一个简单的页面，其中包含文本框中所写内容的警报。

<html>
    <head>
        <script language="javascript">
            var sourceTest = "songs/" + document.getElementById("inputSong").value + ".mp3";

            function jukeBox()
            {
                alert(sourceTest);
            }
        </script>
    </head>
    <body>
        <input type="text"; id="inputSong" style="display: inline; float: left";></input>
        <button 
            id="butter";
            type="button"; 
            onclick="jukeBox()"; 
            style="display: inline; margin-left: 5px; float: left"> 
                Play 
        </button>
    </body>
</html>

问题是警报返回为未定义，除非我这样做;

<html>
    <head>
        <script language="javascript">
            function jukeBox()
            {
                var sourceTest = "songs/" + document.getElementById("inputSong").value + ".mp3";
                alert(sourceTest);
            }
        </script>
    </head>
    <body>
        <input type="text"; id="inputSong" style="display: inline; float: left";></input>
        <button 
            id="butter";
            type="button"; 
            onclick="jukeBox()"; 
            style="display: inline; margin-left: 5px; float: left"> 
                Play 
        </button>
    </body>
</html>

我试图使用全局变量而不是本地变量来使用它。

- 编辑 -

我将整个脚本移动到正文，这似乎解决了问题。

Answer 1

问题出在第一个例子中var sourceTest = "songs/" + document.getElementById("inputSong").value + ".mp3";仅在加载页面时被评估一次，因为脚本在头文件中，它在创建dom元素之前执行，因此document.getElementById("inputSong")将返回null错误（在浏览器控制台Uncaught TypeError: Cannot read property 'value' of null中），因此变量的值变为未定义。

由于您想要获取输入字段的值，因此在这种情况下您可以真正使用全局变量。

如果您仍想使用全局变量，可以将字符串的静态部分存储在全局变量中，并将其用于单击处理程序中的字符串连接，或者使用正则表达式并替换单击处理程序中的模板部分

var prefix = "songs/",
  suffix = ".mp3";

function jukeBox() {
  var sourceTest = prefix + document.getElementById("inputSong").value + suffix;
  alert(sourceTest);
}

<input type="text" ; id="inputSong" style="display: inline; float: left" ;/>
<button id="butter" ; type="button" ; onclick="jukeBox()" ; style="display: inline; margin-left: 5px; float: left">
  Play
</button>

或者

var sourceTest = "songs/{inputSong}.mp3";

function jukeBox() {
  var value = sourceTest.replace(/\{inputSong\}/, document.getElementById("inputSong").value)
  alert(value);
}

<input type="text" ; id="inputSong" style="display: inline; float: left" ;></input>
<button id="butter" ; type="button" ; onclick="jukeBox()" ; style="display: inline; margin-left: 5px; float: left">
  Play
</button>

Answer 2

你可以编写一个正在运行的脚本

systemLog:
    destination: file
    path: c:\net2\secondary3-pc\data\log\mongod.log
storage:
    dbPath: c:\net2\secondary3-pc\data\db
net:
    port: 27021
replication:
    replSetName: repl1

全局变量返回为undefined

2 个答案: