Question

所以我正在学习Web开发，我有问题通过表单获取用户输入，然后将容器的宽度设置为该输入。

首先我用html中的用户输入。

<form class="changesize" action="#">
    Width: <input type="text" name="width" id="txt_width">
   <input type="button" name="submit" value="Change Container Size" 
   onclick="containersize();">
</form>

以下HTML是我希望随其中的文本调整大小的容器。
    <div id="container">
     <p>Lorem ipsum dolor s...</p>
    </div>

现在这是JS应该接受此输入，然后更改容器宽度。

function containersize(){
  var containerwidth = document.getElementById('txt_width');
  var formatwidth = containerwidth.text + ".px";
  var container = document.getElementById('container');
  container.style.width = formatwidth;
}

请帮忙！

谢谢！

Answer 1

您的连接中出现拼写错误（更改＆＃34; .px＆＃34;使用＆＃34; px＆＃34;）并将text更改为{{ 1}}获取输入的值。请参阅代码段

＆＃13;

value

＆＃13;

function containersize(){
  var containerwidth = document.getElementById('txt_width');
  var formatwidth = containerwidth.value + "px";
  console.log(formatwidth);
  var container = document.getElementById('container');
  container.style.width = formatwidth;
}

＆＃13;

无法使用用户输入更改宽度大小

1 个答案: