如何从输入 JS/jQuery 中获取当前值 [重复]

Posted 2023-03-05

【中文标题】如何从输入 JS/jQuery 中获取当前值 [重复]

【英文标题】：How to get a current value from input JS/jQuery [duplicate]

【发布时间】：2018-08-03 17:01:31

【问题描述】：

我是 javascript 的初学者，我有 3 个按钮 添加到购物车，每个按钮都有一个值，所以当我点击其中一个按钮时，我会不断获得第一个按钮的值 这是我的 html 代码

<div class="container main-section">
              <div class="row">
                <div class="col-md-4 col-sm-4 col-xs-12 product">
                  <div class="row product-part">
                    <div class="col-md-12 col-sm-12 colxs-12 img-section">
                      <img src="'. $photolink["photo"] .'">
                    </div>
                    <div class="col-md-12 col-sm-12 col-xs-12 product-title">
                      <h1>'. $row["produit"] .'</h1>
                    </div>
                    <div class="col-md-12 col-sm-12 col-xs-12 product-description">
                      <p>'. $row["description"] .' </p>
                    </div>
                    <div class="col-md-12 col-sm-12 col-xs-12 product-cart">
                      <div class="row">
                        <div class="col-md-6 col-sm-12 col-xs-6">
                          <p>'. $row["price"] .' $</p>
                        </div>
                        <div class="col-md-6 col-sm-12 col-xs-6 text-right product-add-cart">
                          <input type="submit"  value="ADD TO CART" class="btn btn-success" id="productid" data-value="'. $row["id"] .'" onclick="getID()" >
                        </div>
                      </div>
                    </div>
                  </div>
                </div>

这是我的 javascript 代码

function getID()

var val = document.getElementById('productid').getAttribute('data-value');
console.log(val);

【问题讨论】：

当您说“我有 3 件商品”时，您的意思是三个 input 元素与 productid 中的 id 相同吗？如果是这样，那是你的问题。 id 属性在 DOM 中必须是唯一的

是的，他们都是同一个 id

改用类。您可以通过getElementsByClassName() 或querySelectorAll() 选择元素，但请注意，您需要遍历它们以获取它们的值

【参考方案1】：

您必须专门选择一个元素。使用纯 JQuery：

function getID(that) 
  console.log($(that).attr("data-value"));

然后在你的 HTML 上：

<input type="submit" value="ADD TO CART" class="btn btn-success" id="productid" data-value="'. $row["id"] .'" onclick="getID(this)">

【讨论】：

jQuery 对 IMO 来说太过分了。只需that.dataset.value。

我从来没有学过普通的 javascript，但是是的，那可能会更容易，但是哦。

我试过你的解决方案我只得到 undefined

将 this 从 console.log(..) 替换为 that，我的输入错误，检查更新的答案。

我花了几个小时寻找解决方案，非常感谢@Luicy 工作正常，我很感激