Question

以下是我的代码

<div class="control">
    <input type="button" value="big" />
    <input type="button" value="blink" />
    <input type="button" value="bold" />
    <input type="button" value="fixed" />
    <input type="button" value="italics" />
    <input type="button" value="small" />
    <input type="button" value="strike" />
    <input type="button" value="sub" />
    <input type="button" value="sup" />
</div>

然后我希望在点击它时从每个输入中获取值。问题是我不知道如何用javascript编写它。如果在jQuery中是这样的：

$('.control input[type=button]').click(function() {
   console.log($(this).val());
});

如何将上面的代码转换为javascript？

Answer 1

你走了：

var inputs = document.querySelectorAll('.control input[type="button"]');

for (var i=0; i < inputs.length; i++)
{       

     inputs[i].onclick = function()
    {
      console.log(this.value);
    }


}

Answer 2

我会这样做...

var buttons = document.querySelectorAll('.control input[type=button]');
for(var i = 0; i < buttons.length; i++){
   buttons[i].addEventListener('click', function(e){
        console.log(e.target.value);
    });
}

Javascript单击每个输入从中获取值

2 个答案: