編輯文本用戶輸入文本框

Question

到目前爲止，我this jsfiddle

<p>Click the button to remove http:// and www. from input box belove below:</p> 

<textarea id="demo" name="comments" cols="25" rows="5"> 
    http://www.google.com 
</textarea><br> 
<input type="submit" value="Submit" button onclick="myFunction(),myFunction2()" /> 
</form> 

<script> 
function myFunction() 
{ 
    var str=document.getElementById("demo").innerHTML; 
    var n=str.replace("http://",""); 
    document.getElementById("demo").innerHTML=n; 
} 

function myFunction2() 
{ 
    var str=document.getElementById("demo").innerHTML; 
    var m=str.replace("www.",""); 
    document.getElementById("demo").innerHTML=m; 
} 
</script>​ 

它正常工作與文本輸入pre，但它不會改變提交的文本。 我確定有一個簡單的答案，我只是新手，無法解決或找到答案。

Answer 1

您需要使用textarea的.value而不是.innerHTML。

.innerHTML只查看元素中生成的HTML。如果用戶鍵入新內容，則源不會更改。

但是，值的作用：

http://jsfiddle.net/AbSh2/12/

一對夫婦的其他指針：

• 你不需要兩個函數

  document.getElementById("demo").value = ... 
  

  在你的提琴修復做這個操作，你可以看到它可以在一箇中完成。

• 你可以使用type='button'，而不是提交，因爲JavaScript不關心表單提交（只有服務器，接收POST和GET數據上的問題。JavaScript不能）

，您可以簡化你的功能更進一步，不保存字符串所有的地方：

function myFunction() { 
    var str=document.getElementById("demo").value; 
    var n=str.replace("http://",""); 
    var m=n.replace("www.",""); 
    document.getElementById("demo").value=m; 
} 

工作正常。你甚至可以做

function myFunction() { 
    document.getElementById("demo").value = 
     document.getElementById("demo").value.replace("http://","").replace("www.",""); 
} 

而是變得有點混亂IMO，所以應該是學習的目的只有:)