鍵盤向上和向下箭頭用於增加減少值

Question

使用onkeydown和onkeyup事件來增加和減少標簽或某些p標簽中的值。 不需要在文本框中（輸入）

我有很多例子，但它都在文本框中工作。

不使用鼠標我需要在（onkeyup或onkeyright）和（n ...... 4,3,2,1）（onkeydown或onkeyleft）中增加一個（1,2,3,4 ... n）值）標簽或標簽上的按鍵事件

  <input type="text" size="2" value="1" />


<script>
    var $input = $('label');
    $(document).on('keydown', function(event) {
        if (event.which == 38 || event.which == 104) {
            $input.val((parseInt($input.val()) + 1));
        } else if (event.which == 40 || event.which == 98) {
            $input.val((parseInt($input.val()) - 1));
        }
    });
    </script>

這適用於文本框..我如何在標簽中使用它

Answer 1

嘗試這個：

 var $input = $('p'); $(document).on('keydown', function(event) { if (event.which == 38 || event.which == 104) { $input.text((parseInt($input.text()) + 1)); } else if (event.which == 40 || event.which == 98) { $input.text((parseInt($input.text()) - 1)); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <p id="inputValue">0</p> 

你幾乎就在那里，但這是我為了讓它發揮作用所做的改變：

• 使用.text()代替.val()
• 更改為<p>而不是<input>
• 更新了$input以匹配<p>

---

要使用<label>標簽，只需更改即可

• var $input = $('p'); to var $input = $('label'); 和
• <p id="inputValue">0</p>到<label id="inputValue">0</label>

例如

 var $input = $('label'); $(document).on('keydown', function(event) { if (event.which == 38 || event.which == 104) { $input.text((parseInt($input.text()) + 1)); } else if (event.which == 40 || event.which == 98) { $input.text((parseInt($input.text()) - 1)); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <label id="inputValue">0</label>