2015-06-06 152 views
-5

我創建了一個小小的HTML文檔。並且無論何時單擊該按鈕,輸入元素中的文本都將顯示爲綠色,但該功能不會啓動。下面HTML不能正常工作

<html> 
<body style="width: 500px; "> 
    <div style="text-align: center"> 
     <script type="text/javascript"> 
     function func(){ 
      document.getElementById("paragraph").innerHTML = 

      document.getElementById("input").value; 
      } 
     </script>    
     <p style="color: green;" id="paragraph"></p> 
     <input style="height: 30px; width: 480px; border-layout: solid green" id="input"><br> 
     <button style="border-radius: 0px; border: solid grey 1px; 

     background-color: yellow;" onclick="func()">Echo Txt</button> 
    </div> 
</body> 

+0

你通過函數的意思不啓動?請詳細說明。 – nikhil

+3

你的代碼實際上工作:http://codepen.io/anon/pen/vOmyze –

+0

HTML工作得很好 – jantimon

回答

1

您的代碼似乎是工作。

我所做的是清理一些CSS。雖然沒有border-layout這樣的東西(所以我刪除了它)。

function func() { 
 
    document.getElementById("paragraph").innerHTML = document.getElementById("input").value; 
 
}
#input { 
 
    height: 30px; 
 
    width: 480px; 
 
} 
 
#paragraph { 
 
    color: green; 
 
} 
 
.mybutton { 
 
    border-radius: 0px; 
 
    border: solid grey 1px; 
 
    background-color: yellow; 
 
}
<div style="text-align: center"> 
 
    <p id="paragraph"></p> 
 
    <input id="input"> 
 
    <br> 
 
    <button class="mybutton" onclick="func()">Echo Txt</button> 
 
</div>

+0

哦......這只是我的瀏覽器... – RosengreenPedersen