用点击事件信息填充文本字段

filling a text-field with click-event-information

本文关键字：填充 文本 字段 信息 事件      更新时间：2023-09-26

HTML

<div id="wrapper">
  <input type="text" id="text">
  <button id="t-1" value="1">1</button>
  <button id="t-2" value="2">2</button>
  <button id="t-3" value="3">3</button>
</div>

JavaScript

$(function() {
    $('#wrapper').click(function(event) {
      $('#text').append(event.target.value);
    });
  });

单击该按钮不会更改文本字段值！

使用这个：

$(document).ready(function(){
    $('#wrapper').click(function(event) {    
      $('#text').val(event.target.value);
    });
});

请记住append是添加 HTML 内容，而val是获取和设置输入字段值。

append输入

后添加HTML内容。您要查找的内容（更改输入的文本）是 val .

您需要

使用 val() 来设置文本框的值。 append()用于将一个 DOM 元素附加到另一个元素中（例如将动态li附加到ul标签中）。下面是一个工作片段

$(function() {
    $('#wrapper').click(function(event) {
      $('#text').val(event.target.value);
    });
  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
  <input type="text" id="text">
  <button id="t-1" value="1">1</button>
  <button id="t-2" value="2">2</button>
  <button id="t-3" value="3">3</button>
</div>

相关文章：