如何使用javascript更改样式？答案

【问题标题】：How to change style using javascript?如何使用javascript更改样式？
【发布时间】：2015-04-15 05:15:46
【问题描述】：

<div class="club_member">
<input type="text" size="5" onclick="this.value=''" name="scienceClub" value="2">
</div>

如何使用简单的 javascript 命令将值更改为“0”并在输入样式中放置“disable=""'？

【问题讨论】：

value 和 disabled 都不是样式，它们是 input 元素的属性或属性。
复制到：How to disable an input type=text? 和 Change value of input onchange?

标签： javascript

【解决方案1】：

使用object.value 设置值并使用object.disabled 禁用Javascript 中的输入。

演示：

document.getElementById("button").addEventListener("click", function(){  // I have added a sample button for testing
  
  var inputElementObject = document.getElementById("input");  // get the input element object
  
  inputElementObject.value = "0";  // set the value
  inputElementObject.disabled = true;  // set the disabled property
  
});

<div class="club_member">
  
  <!-- set an ID for the input element -->
  <input type="text" size="5" onclick="this.value=''" name="scienceClub" value="2" id="input">
  
  <button id="button">Click me!</button>
  
</div>

Check out how to set the properties for <input> here on MDN.

【讨论】：

@MillieSmith 谢谢老兄！ :D
我喜欢你把它放在一个按钮中的想法。非常感谢。我没有在输入中输入 id。相反，我这样做了。 document.getElementsByName("scienceClub")[0].value = "0"; document.getElementsByName("scienceClub")[0].disabled = false;
@warholzz116 谢谢。我认为这对演示很有帮助。 :) 如果您发现此答案足够好，请将其标记为已接受。

【解决方案2】：

像这样在您的控件中设置 id

<input type="text" id="myControl" size="5" onclick="this.value=''" name="scienceClub" value="2">

然后在脚本中这样尝试

var control=document.getElementById("myControl");
control.value=0;
control.setAttribute("disabled", true);

【讨论】：

谢谢。但我没有设置 id，而是使用 getElementsbyName("scienceClub")[0];

【解决方案3】：

下面的 sn-p 演示了如何使用严格的 JavaScript 更改值和禁用输入。

document.getElementById("input").value = "0";
document.getElementById("input").disabled = true;

<div class="club_member">
  <input type="text" size="5" onclick="this.value=''" name="scienceClub" value="2" id="input">
</div>

【讨论】：

【解决方案4】：

使用与您发布的相同的代码。你只需要改变它的值，它就会被禁用。

 <div class="club_member">
 <input type="text" id='something' size="5" onclick="this.value='0'; this.setAttribute('disabled','true');" name="scienceClub" value="2">
 </div>

 <div class="club_member">
 <input type="text" id='something' size="5" onclick='this.value="0"' name="scienceClub" value="2">
 <button onclick="document.getElementById('something').setAttribute('disabled','true');"> Lock the value </button>
 </div>

【讨论】：