Question

我对JavaScript很新，我想知道是否有人可以帮我解决这个问题。我有三个文本框，前两个显示名字和姓氏。我希望最后一个文本框包含第一个和最后一个。

以下是代码：

<!doctype html>
<html>
    <head>
        <title>Javascript Textbox</title>
    </head>
    <body>
        First Name: <input id="fname" type="text" value="John"><br>
        Last Name: <input id="lname" type="text" value="Smith"><br>
        <input id="textbox" readonly>

        <button onclick="textbox.value=fname.value+' '+lname.value">press to see full name</button>

        <script type="text/javascript" src="testing.js"></script>
    </body>

</html>

这很好用，但是当我尝试使用外部文件testing.js并切换onclick="testFunction()"时，它就不再有用了。

testing.js：

function testFunction() {
    var first = document.getElementById("fname").value;
    var last  = document.getElementById("lname").value;
    var textb = document.getElementById("textbox").value;
    textb     = first + " " + last;
}

Answer 1

http://jsfiddle.net/1vshky4s/

最终你的问题是你正在为texb var分配文本框的值，然后用连接的字符串覆盖它，然后对结果一无所知。

function testFunction()
{
    var first = document.getElementById("fname").value;
    var last = document.getElementById("lname").value;
    var textb = first + " " + last;

    document.getElementById("textbox").value = textb;
}

实际上对textb var做了些什么，你应该好好去。检查小提琴。

Answer 2

将您的功能更改为

function testFunction() {
    var first = document.getElementById("fname");
    var last = document.getElementById("lname");
    var textb = document.getElementById("textbox");
    textb.value = first.value + " " + last.value;
}

jsfiddle demo

Answer 3

移动：

<script type="text/javascript" src="testing.js"></script

进入页面的head。你尝试绑定函数，而不是存在。将在dom之后加载script。

P.S。或者使用＆＃39; onload＆＃39;事件window p.s.s。

这里有正确的功能：

function testFunction()
{
    var first = document.getElementById("fname").value;
    var last = document.getElementById("lname").value;
    var textb = document.getElementById("textbox"); //!

    textb.value = first + " " + last; // here was error

    }

内联Javascript有效，但不在外部工作

3 个答案: