想要获得所选按钮的先前值

时间:2019-06-21 08:03:30

标签: javascript ajax laravel

[StructLayout(LayoutKind.Sequential)]
private struct LibInformation
{
    public IntPtr Version;
    public IntPtr Name;
    public IntPtr Date;
}

static void Main(string[] args)
{
    // Create Pointer for my structure
    IntPtr ptr;

    // Create 3 pointers and allocate them
    IntPtr ptrVersion = Marshal.AllocHGlobal(100);
    IntPtr ptrName = Marshal.AllocHGlobal(100);
    IntPtr ptrDate = Marshal.AllocHGlobal(100);

    // Then declare LibInformation and assign
    LibInformation infos = new LibInformation();

    // Here is probably my missunderstanding (an my error)
    // As I need a ptr to call my function I have to get the Ptr of my struct
    IntPtr ptr = Marshal.AllocHGlobal(300);
    Marshal.StructureToPtr(infos, ptr, false);

    // Assign
    infos.Version = ptrVersion;
    infos.Name = ptrName;
    infos.Date = ptrDate;

    // Call function
    GetInfos(out ptr);

    var data = Marshal.PtrToStructure<LibInformation>(ptr);
    var version = Marshal.PtrToStringAnsi(data.Version);
    Console.WriteLine(version) // result : still ""

    Console.ReadLine();
}


[DllImportAttribute("MyLibrary.dll", CallingConvention = CallingConvention.Cdecl, EntryPoint = "GetInfos")]
private static extern void GetInfos(out IntPtr test);

这是循环。

我想每次单击数量上移和下移按钮时获取输入值。有多个要素。 如何通过单击向上和向下按钮在javascript中查找输入值。

3 个答案:

答案 0 :(得分:0)

您可以使用localStorage存储数量的值,这将使data持久。

请检查以下代码段:

const down = document.querySelector('.down');
const up = document.querySelector('.up');
const input = document.querySelector('.quantity');

// store utility function
const store = {
  existsIn: function(key) {
    return this.getFromKey(key) !== null;
  },
  getFromKey: function(key) {
    return window.localStorage.getItem(key);
  },
  add: function(key, value) {
    const storeSource = window.localStorage.setItem(key, value);
  }
}

const quantity = Object.create(store);

quantity.exists = function() {
  return this.existsIn('quantity');
}

quantity.increase = function() {
  let storedQuantity = this.exists() ? parseFloat(this.getFromKey('quantity')) : 0;
  storedQuantity = storedQuantity + 1;
  this.add('quantity', storedQuantity); 
}

quantity.decrease = function() {
  let storedQuantity = this.exists() ? parseFloat(this.getFromKey('quantity')) : 0;
  if(storedQuantity > 0) {
    storedQuantity = storedQuantity - 1;
  }

  this.add('quantity', storedQuantity);
}

quantity.show = function() {
  return this.exists() ? this.getFromKey('quantity') : 0;
}

// event listeners for up and down buttons 
up.addEventListener('click', function() {
  quantity.increase();

  // update input on button click
  input.value = quantity.show();
})

down.addEventListener('click', function() {
  quantity.decrease();

  // update input on button click
  input.value = quantity.show();
})

// update input on page load
input.value = quantity.show();

在这里您可以找到有用的小提琴: https://jsbin.com/tavalocoti/5/edit?html,js,console,output

答案 1 :(得分:0)

您可以添加具有onClick功能的parents事件,以检测按钮附近的输入。

$(document).on('click','.quantity-up',function(){
  $qtyElemnt = $(this).parents('.quantity').find('.form-qty');
  $qty = $qtyElemnt.val();
  $qtyElemnt.val(Number($qty)+1);
});

$(document).on('click','.quantity-down',function(){
  $qtyElemnt = $(this).parents('.quantity').find('.form-qty');
  $qty = $qtyElemnt.val();
  $qtyElemnt.val(Number($qty)-1);
});
.quantity {
   padding: 10px;
}
.quantity-nav{
    display: inline-block;
}
.quantity-button {
    display: inline-block;
    padding: 5px;
    background-color: #c7c5c5;
    border: 1px solid #585353;
    cursor: pointer;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<div>
  <div class="quantity">
        <input type="number" name="qty" value="1" class="form-qty form-control" min="1">
         <div class="quantity-nav">
              <div class="quantity-button quantity-up qty-up">+</div>
              <div class="quantity-button quantity-down qty-down">-</div>
         </div>
    </div>
    <div class="quantity">
        <input type="number" name="qty" value="1" class="form-qty form-control" min="1">
         <div class="quantity-nav">
              <div class="quantity-button quantity-up qty-up">+</div>
              <div class="quantity-button quantity-down qty-down">-</div>
         </div>
    </div>
    <div class="quantity">
        <input type="number" name="qty" value="1" class="form-qty form-control" min="1">
         <div class="quantity-nav">
              <div class="quantity-button quantity-up qty-up">+</div>
              <div class="quantity-button quantity-down qty-down">-</div>
         </div>
    </div>
</div>

谢谢:-)

答案 2 :(得分:0)

实际上,您的问题很容易解决。 尝试将此脚本添加到<body>的末尾。 我建议您也对html进行一些修改:对控件使用<button><input type="button"甚至<a>标签。 我添加了一些关于可以在<input type="number">上设置的min / max / step属性的逻辑,但这是可选的。您可以自行更改。

document.addEventListener("DOMContentLoaded", function() {
  const qtyWraps = document.getElementsByClassName('quantity');
  for (let i = 0; i < qtyWraps.length; i++) {
    const qtyWrap = qtyWraps.item(i);
    const input = qtyWrap.querySelector('.form-qty');
    const up = qtyWrap.querySelector('.qty-up');
    const down = qtyWrap.querySelector('.qty-down');
    const output = qtyWrap.querySelector('.output');
    up.addEventListener('click', function(e) {
      e.preventDefault();
      addValue(1);
    });
    down.addEventListener('click', function(e) {
      e.preventDefault();
      addValue(-1);
    });
    input.addEventListener('input', function() {
      output.textContent = input.value
    });
    const addValue = function(value) {
      const current = parseInt(input.value);
      const min = input.getAttribute('min') || -Infinity;
      const max = input.getAttribute('max') || Infinity;
      const step = input.getAttribute('step') || 1;
      const newValue = Math.min(max, Math.max(min, current + value * step));
      input.value = newValue;
      if (newValue <= min) down.setAttribute('disabled', 'disabled');
      else down.removeAttribute('disabled');
      if (newValue >= max) up.setAttribute('disabled', 'disabled');
      else up.removeAttribute('disabled');
      input.dispatchEvent(new Event('input'));
    }
    addValue(0)
  }
});
.quantity {
  display: block;
  width: 500px;
  margin: auto;
  text-align: center;
}

.quantity .form-qty {
  display: inline-block;
}

.quantity .quantity-nav {
  display: inline-block;
}

.quantity .output {
  background: yellow;
  width: 500px;
  margin: 1em auto 0;
}
<div class="quantity">
  <input type="number" name="qty" id="qty" value="1" class="form-qty form-control" min="1">
  <div class="quantity-nav">
    <button class="quantity-button quantity-up qty-up">+</button>
    <button class="quantity-button quantity-down qty-down">-</button>
  </div>
  <!-- I put it here to show the output result -->
  <div class="output">1</div>
</div>