1

我正在尝试了解 JavaScript 中的用户定义对象。具体来说，我正在尝试创建一个用户定义对象的方法，该方法将使用并附加到它document.getElementById("holder")，并使用document.createElement('p')附加到它的文本节点document.createTextNode("text")。

目前，我的方法没有这样做。我已经测试了该方法并且它被调用了，但是item.appendChild(otheritem). 我浏览了其他帖子，但没有人解释我的情况，至少我知道。我的代码如下。

<html>
    <head>
        <title></title>
        <script type="text/javascript">
            function Person(fn, ln) {
                this.fname = fn;
                this.lname = ln;
            }
            Person.prototype.getFullName = function () {
                var myPara = document.createElement('p');
                var strFullName = document.createTextNode("super");
                myPara.appendChild(strFullName);
                var objHolder = document.getElementById("objHolder");
                objHolder.appendChild(myPara);
            };

            function getSome() {
                var fN = document.getElementById("fname").value;
                var lN = document.getElementById("lname").value;
                var Myperson = new Person(fN, lN);
                alert(Myperson.fname);
                Myperson.getFullName();
            }
        </script>
    </head>
    <body>
        <form id="holder">First Name:
            <input id="fname" type="text" width="40" />Last Name:
            <input id="lname" type="text" width="40" />
            <button id="buildObj" value="Click" onClick="getSome()">Click</button>
        </form>
        <div id="objHolder"></div>
    </body>
</html>

任何帮助或建议将不胜感激。另外，如果我错过了一个关键概念，知道这也很好。

谢谢，迈克

4

1 回答 1

2

追加有效，但同时提交了表单，因此它重定向到另一个页面。return false您需要在事件的事件处理程序中取消提交表单的自然浏览器行为submit。

<!DOCTYPE html>
<html>
<head>
<title>
</title>
<script type="text/javascript">
function Person(fn,ln) {
this.fname = fn;
this.lname = ln;
}

Person.prototype.getFullName = function()
{

var myPara = document.createElement('p');
var strFullName = document.createTextNode("super");myPara.appendChild(strFullName);
var objHolder = document.getElementById("objHolder");objHolder.appendChild(myPara);
};

function getSome(){
var fN = document.getElementById("fname").value;
var lN = document.getElementById("lname").value;

var Myperson = new Person(fN,lN);
alert(Myperson.fname);
Myperson.getFullName();
}
</script>
</head>
<body>
<form id="holder">
First Name: <input id="fname" type="text" width="40" />
Last Name: <input id="lname" type="text" width="40" />
<button id="buildObj" value="Click" onClick="getSome()">Click</button>
</form>
<div id="objHolder">
</div>
<script>
document.getElementById('holder').onsubmit=function(){ return false; }
</script>
</body>
</html>

更优雅的方法是使用event对象然后调用event.preventDefault，但是由于浏览器的不一致，需要大量的代码才能让它正确......所以对于这个基本示例，onsubmit应该return false就足够了。

于 2012-10-31T19:18:10.237 回答