2012-08-07 126 views
0

好吧,我必须制作一个基本的JavaScript文件,它从两个输入字段获取数据,然后在单击按钮时使用相关的新值更新div标签。这是我在JS中做过的第一件事,所以请原谅任何不好的做法。我有3个按钮,前两个分别保存和更新名称或年龄。第三个创建一个新的对象“init”并保存和更新两者。我希望我能告诉你更多关于什么是错误的,但是当我点击任何按钮时没有任何变化,所以我不知道。使用JavaScript和html输入和更新div标签

感谢您的帮助

这里是我的HTML:

<!DOCTYPE HTML> 
<html> 
    <head> 
    </head> 
    <body> 
     <form name="inForm"> 
      <input type="text" name="user"/> 
      <input type="text" name="age"/> 
     </form> 
    <button onClick="User.setName"> Save name </button> 
    <button onClick="User.setAge"> Save age </button> 
    <button onClick="writeIn"> Save </button> 
    <div id="update"> 
    </div> 
      <script language="JavaScript1.2" src="script.js" type="text/javascript"/> 
    </body> 

</html> 

这里是我的javascript:

var User = function() { 
    var save = function(callback) { 
     if (callback) { 
      callback(); 
     } 
    } 

    return { 
     name: function() { 
      write = document.getElementById('update'); 
      write.innerHTML = this.name; 
      return this.name; 
     }(), 
     age: function() { 
      write = document.getElementById('update'); 
      write.innerHTML = this.age; 
      return this.age; 
     }(), 
     setName: function() { 
      this.name = document.inForm.name; 
     }, 
     setAge: function() { 
      this.age = document.inForm.age; 
     }, 
     save: save, 
     init: function(name, age) { 
      this.name = name; 
      this.age = age; 
      write = document.getElementById('update'); 
      write.innerHTML = this.age + this.name; 
      return this; 
     } 
    }; 
}; 

function writeIn() { 
    var a = new User 
    a.init(document.inForm.name, document.inForm.age) 
} 

console.log(a.name, b.name); 

回答

0

你能不能试着这么做:

 <script type="text/javascript"> 
    function changeText2(){ 
     var userInput = document.getElementById('userInput').value; 
     document.getElementById('boldStuff2').innerHTML = userInput; 
    } 
    </script> 
    <p>Welcome to the site <b id='boldStuff2'>dude</b> </p> 
    <input type='text' id='userInput' value='Enter Text Here' /> 
    <input type='button' onclick='changeText2()' value='Change Text'/> 

我认为你错过了您的功能通过ID选择用户输入。只是试图帮助你,但不知道。 我举了一个例子http://www.tizag.com/javascriptT/javascript-innerHTML.php/

0

要调用一个函数,你必须在它后面加括号。

<button onClick="User.setName()"> Save name </button> 

另外,我觉得在JavaScript中以name所有引用应该是user