获取html中的文本输入并转换为javascript

Getting text input in html and transferring to javascript

本文关键字:转换 javascript 输入 文本 html 获取      更新时间:2024-02-04

我了解如何使用html中的输入来调用与html ex:在同一目录中定义的javascript

<input type="button" value="Submit" onclick="someFunc(500)" >

因此,如果单击按钮,java脚本将运行someFunc(500),有没有一种方法可以进行文本输入,并且当按下按钮时,将该输入用作java脚本的参数值?我知道这行不通,我甚至没有定义一个按钮,而是像一样

<input type="text" id= "example" onclick="someFunc(this.value)">

输入文本字段中的数据示例在哪里?

使用监听器怎么样?

var example = document.getElementById("example");
example.onclick = function(){
    someFunc(example.value);
}

您可以使用jQuery来完成此操作:请参阅此jsfiddle

HTML:

<input type="text" id="example" value="12345">

JavaScript:

$('#example').on('click',function() {
    console.log($(this).val()); // 12345
});

HTML5推荐的方法是使用data-*属性。像这样:

HTML:

<div id="example2" data-product-id="my-product-1"></div>
<button id="getProductId">Get Product Id</button>

JavaScript:

$('#getProductId').on('click',function() {
    console.log($('#example2').attr('data-product-id')); // my-product-1
});
<script type="application/javascript">
  function someFunc() {
    var value = document.getElementById('example').value;
    // do something with value here
    return false;
  }
</script>
<input type="text" id="example">
<input type="button" value="Submit" onclick="someFunc()" >