Question

我已经创建了一个基本的html输入表单，但是想在用户输入中添加一些文本，我该怎么做？

<form action="https://api.hipchat.com/v1/rooms/message" method="get" target="">
  <input type="hidden" name="room_id" value="example">
  <input type="hidden" name="from" value="example">
  <input type="hidden" name="color" value="example">
  <input type="hidden" name="notify" value="example">
  <input type="hidden" name="auth_token" value="example">

  Message: <input type="text" name="message"><br>
  <input type="submit" value="Submit">
</form>

我想从用户那里获得一些输入，然后将其发布到HipChat会议室。所有这些都按原样运作。但是我想在消息之前添加“@Lewis”，所以我收到了关于HipChat的提及。是否可以做类似的事情：

value =“@ Lewis”+“提交”

谢谢！

Answer 1

无需为此请求添加jQuery。一个小的JavaScript将为您提供同样好的，并且更轻量级。但是如果你计划使用很多js，你可能想开始检查jQuery。

＆＃13;

<form id="myForm" action="https://api.hipchat.com/v1/rooms/message" method="get" target="">
  <input type="hidden" name="room_id" value="example">
  <input type="hidden" name="from" value="example">
  <input type="hidden" name="color" value="example">
  <input type="hidden" name="notify" value="example">
  <input type="hidden" name="auth_token" value="example">Message:
  <input type="text" name="message" id="myMessage">
  <br>
  <input type="submit" value="Submit">
</form>

<script type="text/javascript">
  window.onload = function() {
    document.getElementById("myForm").onsubmit = function() {
      var msgElement = document.getElementById("myMessage");
      msgElement.value = '@Lewis: ' + msgElement.value;
      alert(msgElement.value); //comment/remove this line
      return true;
    };
  };
</script>

＆＃13;

请注意，我在表单和消息元素中添加了 id 。

Answer 2

您可以使用JavaScript执行此操作。添加提交处理程序并将所需的文本添加到消息的开头。使用jQuery的一个例子：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js">   </script>
<script>
  $(function() {
    $('form').submit(function() {
      var $m = $(this).find('[name=message]');
      $m.val('@Lewis ' + $m.val();
    });
  });
</script>

如何将文本附加到HTML输入表单？

2 个答案: