2016-12-28 51 views
1

我想爲複製製作一個模板並粘貼它有一個輸入,並且我想在其中放入一些文本並按下一個按鈕,指出更新並複製從輸入文本到某處模板Javascript從輸入中獲取文本並將其複製到一個範圍

我嘗試:

<!DOCTYPE HTML> 
 
<html> 
 
<head> 
 
<title>Donovan_D Minecraft - Youtube Description 
 
Template</title> 
 
</head> 
 
<body> 
 
<!--Start Template--> 
 
<div>===================================<br> 
 
My Channel:<br> 
 
https://youtube.com/c/DonovanDMinecraft<br> 
 
===================================<br> 
 
Twitch:<br> 
 
http://twitch.tv/donovan_dmc<br> 
 
Twitter:<br> 
 
http://twitter.com/Donovan_DMC<br> 
 
===================================<br> 
 
Sub2Janabell:<br> 
 
https://youtube.com/channel/UC0NTNba35ADUstIoLm 
 
YLiiA<br> 
 
===================================<br> 
 
My <span style="text-decoration:underline;" id="v">1.9, 
 
1.10, 1.11</span> Skyblock/Guilds Server:<br> 
 
IP: play.mcpsb.co<br> 
 
Server store:<br> 
 
http://store.mcpsb.co<br> 
 
Server Website:<br> 
 
https://www.mcpsb.co<br> 
 
===================================<br> 
 
Thanks for <span style="text-decoration:underline;" 
 
id="sub">970</span> Subscribers! make sure to like, 
 
comment, subscribe, and Stay Awesome! 
 
===================================<br> 
 
<!--End Template--> 
 
<hr> 
 
NOT PART OF TEMPLATE<br> 
 
</div> 
 
<b>Version:</b><br> 
 
Change: <input id="vr"><br> 
 
<button onclick="ver()">Update Version</button><br> 
 
<hr> 
 
<b>Subscriber Count:</b><br> 
 
Change: <input id="cs"><br> 
 
<button onclick="csub()">Update Subscriber 
 
    Count</button><br> 
 
<hr> 
 
<script type="text/javascript"> 
 
function ver() { 
 
document.getElementById("v").textContent = 
 
document.getElementById("vr").value; 
 
} 
 
function csub() { 
 
document.getElementById("sub").textContent = 
 
document.getElementById("cs").value; 
 
} 
 
</script> 
 
</body> 
 
</html>

[我試圖做兩次]

我在這裏做錯了什麼嗎?

解決,還有一件事,有沒有辦法看看輸入是否是在跨度相同,或者如果輸入是空的?我只想要在他們中使用的數字...有沒有辦法阻止其他字符/取代themy一旦他們鍵入?

Aswell for the subscriber Ammount我想從akshatmittal.com或其他一些實時計數服務的YouTube用戶獲得實時數字。有沒有一種方法來獲得沒有PHP,AJAX或除了JavaScript和HTML之外的任何其他活動用戶數量的方法

回答

4

問題是,您試圖從.innerHTML的文本框中獲取數據。表格字段值需要用.value得到。

此外,如果被輸入到文本框中的數據將不包含需要被解析的任何HTML,你應該使用.textContent該數據集到您的<span>!而非.innerHTML因爲沒有任何HTML。

.value是用於獲取/設置形式字段值(複選框,單選按鈕,文本框等)或屬性值。

.innerHTML用於獲取/設置將包含HTML標記的非表單字段元素內容。使用此設置內容時,瀏覽器將解析所設置的值中的任何HTML。

.textContent用於獲取/設置不包含HTML標記的非表單字段元素內容。 HTML標記將被忽略。當沒有HTML被獲取/設置時,.textContent是更好的選擇,因爲它的性能好於.innerHTML(不需要解析任何東西)。

<!DOCTYPE HTML> 
 
<html> 
 
    <head> 
 
    <title>Donovan_D Minecraft - Youtube Description Template</title> 
 
</head> 
 
<body> 
 
    <h3>To View HTML Click <a href="code.txt">Here </a></h3><br> 
 
    <!--Start Template--> 
 
    <div>===================================<br> 
 
    My Channel:<br> 
 
    https://youtube.com/c/DonovanDMinecraft<br> 
 
    ===================================<br> 
 
    Twitch:<br> 
 
    http://twitch.tv/donovan_dmc<br> 
 
    Twitter:<br> 
 
    http://twitter.com/Donovan_DMC<br> 
 
    ===================================<br> 
 
    Sub2Janabell:<br> 
 
    https://youtube.com/channel/UC0NTNba35ADUstIoLmYLiiA<br> 
 
    ===================================<br> 
 
    My <span style="text-decoration:underline;" id="v">1.9, 1.10, 1.11</span> Skyblock/Guilds Server:<br> 
 
    IP: play.mcpsb.co<br> 
 
    Server store:<br> 
 
    http://store.mcpsb.co<br> 
 
    Server Website:<br> 
 
    https://www.mcpsb.co<br> 
 
    ===================================<br> 
 
    Thanks for <span style="text-decoration:underline;" id="sub">970</span> Subscribers! make sure to like, comment, subscribe, and Stay Awesome! 
 
    ===================================<br> 
 
    <!--End Template--> 
 
    <hr> 
 
    NOT PART OF TEMPLATE<br> 
 
    </div> 
 
    <b>Version:</b><br> 
 
    Change: <input id="vr"><br> 
 
    <button onclick="ver()">Update Version</button><br> 
 
    <hr> 
 
    <b>Subscriber Count:</b><br> 
 
    Change: <input id="cs"><br> 
 
    <button onclick="csub()">Update Subscriber Count</button><br> 
 
    <hr> 
 

 
    <script type="text/javascript"> 
 
    // Get/set form-field values using the .value property 
 
    // Get/set non-form-field values with either .textContent or .innerHTML 
 

 
    function ver() { 
 
     document.getElementById("v").textContent = document.getElementById("vr").value; 
 
    } 
 
    
 
    function csub() { 
 
     document.getElementById("sub").textContent = document.getElementById("cs").value; 
 
    } 
 
    </script> 
 

 
    </body> 
 
    </html>

-1

試試下面的腳本修改,以獲得輸入值,改變目標元素的的textContent。

https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent

<script type="text/javascript"> 
function ver() { 

document.getElementById("v").textContent = document.getElementById("vr").value; 
} 
function csub() { 
document.getElementById("sub").textContent = document.getElementById("cs").value; 
} 
</script> 
+0

這怎麼比我的答案有什麼不同? –

+0

@Scott它不是。他只是偷了你的互聯網點。 – Rahul

+0

@斯科特,現在你有你的觀點,因爲你做了更多的工作... –

相關問題