javascript - 需要帮助将 jQuery 函数转换为 JavaScript？

Question

我正在更新产品，我可以让产品信息预填充更新表单并使用 jQuery 更新产品信息，但我想使用 JavaScript。如何将此 jQuery 代码转换为 JavaScript？

我正在遵循在线教程，该人正在使用 jQuery，这很酷，但我想了解如何使用 Javascript 执行相同的方法。

Javascript代码:

$(document).on('pagebeforeshow', '#updatedialog', function() {
  $('#newName').val(currentProduct.name);
  $('#newQuantity').val(currentProduct.quantity);
});

function updateProduct() {
  var newName = $('#newName').val();
  var newQuantity = $('#newQuantity').val();
  productHandler.updateProduct(currentProduct.id, newName, newQuantity);
}

HTML 更新表单

<form>
  <div class="ui-field-contain">
    <label for="newName"
           class="ui-hidden- accessible">Name</label>
    <input type="text"
           id="newName"
           data-clear-btn="true"
           placeholder="New Name"/>
    <br/>

    <label for="newQuantity"
           class="ui-hidden-accessible">Quantity</label>
    <input type="number" 
           name="number" 
           pattern="[0-9}"
           id="newQuantity" 
           value="" 
           data-clear-btn="true" 
           placeholder="New Quantity"/>
    <br/>
    <button class="ui-btn ui-icon-plus ui-btn-icon-left"
            id="btnupdate"
            onclick="updateProduct()">
      Update
    </button>
  </div>
</form>

更新表单应填充已输入的产品信息，然后更新对字段所做的更改并将其保存为新对象。我可以在 jQuery 中完成此操作，但我需要在 Javascript 中完成此操作的帮助。

Answer 1

看来您当前使用 jquery 所做的只是通过 ID 获取输入元素的值。您可以使用 JavaScript 通过 ID 选择表单元素并获取 value 属性来完成此操作。

val value = document.getElementById("elemID").value;

你的代码应该是这样的

 function updateProduct(){
 var newName= document.getElementById("newName").value;
 var newQuantity = document.getElementById("newQuantity").value;
 productHandler.updateProduct(currentProduct.id, newName, newQuantity);
  }