2012-03-03 53 views
0

我可以动态地用同一个html页面上的textarea的值替换h1元素的值。但是,一旦我在页面上放置多个表单,在一个表单上放置h1标签,并将textarea放置在另一个表单上,当我尝试仅使用纯JavaScript使用textarea值更新h1值时,什么都不会发生。用另一个表单元素的textarea值动态更新h1元素

我试过getElementById,getElementByTagName,innerHTMLsetAttribute无济于事。这是不可能的,或者我错过了什么?我在网上找不到解决此问题的单个示例。

UPDATE:

<form id=form1 action=""> 
    <h1 id="h1tag">I'm H1</h1> 
    </form> 

    <form> 
    <label for='text1'>Change H1:</label> 
    <input type="textarea" value="" id="text1"/> 
    <button onclick="newHeading();">newHeading()</button> 
    </form> 

的外部JavaScript: 功能newHeading() { 的document.getElementById(h1tag).innerHTML =的document.getElementById(文本)。价值; }

+2

发布您的代码。你所谈论的是完全可能的,但是没有人能够在没有看到当前代码中存在什么问题的情况下为你提供帮助。 – 2012-03-03 01:19:37

+0

添加了代码Nathan。希望它是有道理的。 JS新手。 – 2012-03-03 01:46:45

回答

3

用一个简单的function用的适当ID

function updateH1(ta,h1) { 
    var textArea=document.getElementById(ta),header=document.getElementById(h1); 
    if(textArea.value) { 
     header.innerHTML=textArea.value; 
    } 
    else { 
     textArea.focus(); 
    } 
} 

然后在你的formonsubmit()一套用它来return false

<h1 id="test_h1">This will change</h1> 
<form onsubmit="return false;"> 
    <label for="text1">Change H1:</label> 
    <input type="text" value="" id="text1"/> 
    <button onclick="updateH1('text1','test_h1');">updateH1()</button> 
</form> 
+0

我只是试过这个'faino,但没有运气。你可以看看我的代码,并告诉我我做错了什么。谢谢。 – 2012-03-03 01:48:03

+0

您需要在表单上为表单返回false,以便在不重新加载页面的情况下运行脚本;检查我的工作脚本的答案。 – faino 2012-03-03 01:56:28

+0

终于!谢谢@faino!我在我的智慧结束。非常感谢。 – 2012-03-03 02:12:58

相关问题