在弹出窗口中，更改跨度中的文本

Question

I was trying to add an external JavaScript file to my HTML for a practice Chrome extension. 我试图将外部JavaScript文件添加到HTML中，以练习Chrome扩展程序。 It has a slider whose value needs to be taken and sent back to a span tag on the popup.html , As I looked up I need to have a separate JavaScript file and create an onchange event listener to take the element and pass its value. 它有一个需要获取其值并将其发送回popup.html上的span标签的滑块，当我查找时，我需要一个单独的JavaScript文件并创建一个onchange事件侦听器以获取该元素并传递其值。 But I cannot get the value to show on span tag. 但是我无法获得显示在span标签上的值。 Please guide on what I am doing wrong. 请指导我做错了什么。

This is the HTML (popup.html) 这是HTML（popup.html）

<!doctype html>

<html>
 <head>
   <title>Slide</title>
 </head>

 <body>
     <input type="range" min="0" max="50" value="0" step="5" id="slider" />
     <span id="range">0</span>
     <script type="text/javascript" src="popup.js"></script>
 </body>
</html>

And This is the JavaScript file (popup.js) 这是JavaScript文件（popup.js）

 document.getElementById("slider").onchange = function() {showValue()};


 function showValue()
 { 
    var newValue = document.getElementById("slider");
    var rng = document.getElementById("range");
    rng.value = newValue.value;
 }

Answer 1

Everything is correct except one line in your popup.js file 一切正确，但popup.js文件中只有一行

Change 更改

rng.value = newValue.value;

To 至

rng.textContent = newValue.value;

because you want change the text inside the tag. 因为您要更改标记内的文本。

 document.getElementById("slider").onchange = function() {showValue()}; function showValue() { var newValue = document.getElementById("slider"); var rng = document.getElementById("range"); rng.textContent = newValue.value; }

 <input type="range" min="0" max="50" value="0" step="5" id="slider" /> <span id="range">0</span>

在弹出窗口中，更改跨度中的文本

问题描述

1 个解决方案

解决方案1
1 已采纳 2017-02-26 04:45:30

在弹出窗口中，更改跨度中的文本

问题描述

1 个解决方案

解决方案1 1 已采纳 2017-02-26 04:45:30

解决方案1
1 已采纳 2017-02-26 04:45:30