javascript - document.write Javascript 函数

Question

这是我的代码:

<script LANGUAGE="Javascript">
        function choiceReturn(obj) {
            switch(obj.value) {
                case "1":
                    document.write("<input value='Fund (L###)' type='text' 
                    class='button3' onfocus='if(this.value == "Fund (L###)"){this.value = '';}' 
                    onblur="if(this.value == ''){this.value = 'Fund (L###)'}">");

            }
        }
        </script>

<select name="funds_menu" onchange="choiceReturn(this);">
            <option selected>Choose 1 to 3</option>
            <option value="1">1. Choose fund</option>
            <option value="2">2. Prepare data</option>
            <option value="3">3. Perform valuation</option>
            </select>

我的意图:从列表中选择第一项后，会出现基金 (L###) 输入框。我还有一些 onblur 和 onfocus 的小代码，以使它更酷一些。

但是，什么也没有发生。我究竟做错了什么？那里有很多引号。也许这就是困惑的原因。

Answer 1

JavaScript 中不存在多行字符串。您必须将它们单独连接起来。此外，某些嵌套的嵌套字符串未正确转义。

固定代码:

document.write("<input value='Fund (L###)' type='text' " +
    "class='button3' onfocus='if(this.value == \"Fund (L###)\"){this.value = \"\";}' " + 
    "onblur='if(this.value == \"\"){this.value = \"Fund (L###)\"}'>");

但是，document.write 通常是一个坏主意™，并且通过 document.createElement、element.setAttribute 等方法进行 DOM 操作(或直接使用 JS DOM API 设置它们)，element.addEventListener 和 element.appendChild 几乎总是更好的方法。

这是重写为不使用 document.write 的代码:

var inputElement = document.createElement('input');
inputElement.value = 'Fund (L###)';
inputElement.type = 'text';
inputElement.className = 'button3';
inputElement.addEventListener('focus', function() {
    if (this.value == "Fund (L###)") {
        this.value = "";
    }
});
inputElement.addEventListener('blur', function() {
    if (this.value == "") {
        this.value = "Fund (L###)"
    }
});
document.getElementById('someElement').appendChild(inputElement);

另请注意，您尝试执行的操作已存在:placeholder="Fund (L###)" .