Question

因此，如果要在表单中单击某个按钮，我想获得一个特定的值，但是要以某种方式监听所有按钮，而不仅是表单中的按钮。

我也尝试通过以下方式调用该类，而不是下面的JavaScript示例：

$('.modifygap').bind('click', function (e) {

但是在此示例中，该值未正确设置。

这是我的html：

<button type="button" id="anotherbutton">Another</button>

<form action="editortoken_information" id="showtoken" method="POST">

    <button class="btn btn-outline-secondary" type="submit" name="modifygap" id="modifygap" class="modifygap"
    value="14" data-value="test">14</button>

    <button class="btn btn-outline-secondary" type="submit" name="modifygap" id="modifygap" class="modifygap" 
    value="15" data-value="test">15</button>

</form>

这是我的javascript函数：

$(document.getElementById("showtoken")).ready(function () {
    $("button").click(function (e) {
         e.preventDefault();
         document.getElementById('tokenindex').value = this.getAttribute("data-value");
    })
})

我认为通过仅侦听特定ID只会检测到表单中的按钮单击。但是出于某种原因，它正在监听所有按钮的点击。

Answer 1

使用event.target.value获取被点击元素的值。

$(document).ready(() => {
  $('.modifygap').bind('click', function (e) {
    console.log('e', e.target.getAttribute("data-value"))
  });  
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button type="button" id="anotherbutton">Another</button>



    <button class="btn btn-outline-secondary modifygap" type="submit" name="modifygap" id="modifygap"
    value="14" data-value="test14">14</button>

    <button class="btn btn-outline-secondary modifygap" type="submit" name="modifygap" id="modifygap" 
    value="15" data-value="test15">15</button>

识别表单中的特定按钮

1 个答案: